Question

我正在使用SVG Map for India，它工作正常，但问题是如果我点击任何其他状态，我需要，父ID不会停用父ID应该与“填充颜色 - 灰色”和子颜色相反应该活跃在绿色。

附图供参考，请参阅。

我在Jquery代码下面使用background：

 <script>
  $(document).ready(function(e) {
    $('path[id^="map_"]').click(function(){
      $(this).css('fill', "green");
    });
  });
 </script>

http://www.acmearchitectural.com/indiamapsvgfiles/map.html#

Answer 1

我首先要停用所有状态，然后在目标上使用fill：

<script>
    $(document).ready(function(e) {
        $('path[id^="map_"]').click(function(){
            var t = $(this)
                th;

            $('path[id^="map_"]').each(function () {
                th = $(this);
                if (th.attr("id") !== t.attr("id")) {
                    th.css('fill', 'gray');
                } else {
                    t.css('fill', "green");
                }
            });
        });
    });
</script>

onClick SVG Map背景颜色应仅对父级有效

1 个答案: