on单击SVG地图背景颜色应仅对父级有效

Question

我正在为印度使用 SVG 地图，它工作正常，但问题是 如果我单击任何其他状态，则父 ID 不会停用，我需要 父 ID 应使用"填充颜色 - 灰色"和子颜色处于活动状态 应该在绿色中处于活动状态。

附图供参考，请看一看。

SVG 印度地图

我正在使用下面的Jquery代码作为背景：

<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>