Карта SVG onclick цвет фона должен быть активным черным"# 000"

user2147423 спросил: 12 мая 2018 в 04:56 в: jquery

Я использую эту карту SVG India в своем проекте, цвета мыши меняются, но мне нужно, если пользователь нажмет на любое государство, тогда он должен перенаправить на другую страницу, а цвет фона должен быть активным, как черный "# 000" этого State.

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

Я пытаюсь выполнить код jquery ниже, но не повезло:

$(document).ready(function(e){  
    $('path[id^="select"]').click(function(){    
        $(this).css('background-color',"#ccc") 
    })
})

, пожалуйста, помогите мне в этом, как я могу исправить эту проблему.

2 ответа

bhmahler ответил: 12 мая 2018 в 05:09

Чтобы изменить цвет фона этого пути, вам нужно будет установить атрибут fill css

$(document).ready(function(e){  
    $('path[id^="select"]').click(function(){    
        $(this).css('fill',"#000") 
    })
})

В приведенном примере, в примере, который вы связали, есть события, которые уже устанавливают это значение, поэтому, если он затуманивается, он возвращается к исходному цвету. У вас есть контроль над этими событиями?

Baro ответил: 12 мая 2018 в 05:17

У вас связанный SVG имеет предустановленное событие для каждого состояния <path id="map_1" onclick="return get_state('map_1');"..., и вы можете использовать его, добавив функцию get_state (вторая опция).

Или используя JQuery для добавления события клика, но с правильным селектором map_, а не select (первый вариант). Селектор [id^="...."] означает id starts with"....".

Первый вариант

 $(document).ready(function(e) {
   $('path[id^="map_"]').click(function() {
     $(this).css('stroke', "#ff0000");
   });
 });

Второй вариант

 function get_state(map) {
   $('#' + map).css('fill', '#000000');
   alert(map);
 }

Пример JSFiddle