jQuery Maphilight. Toggle alwaysOn перед тем, как выделить новый

Question

Переключение выбранных областей при наведении указателя мыши на новые области или выборе новой области.

Я использую jQuery Maphilight для выделения выделенных областей на карте. Я успешно добавил состояние щелчка, поэтому область карты остается светящейся, когда пользователь нажимает на нее. Но когда они нажимают вторую и третью область, 1-я область остается высокой, что я не хочу.

Как я могу переключить этот атрибут alwaysOn для отключения всех элементов. Кажется, я не понимаю.

Спасибо.

.bind('click.maphilight', function(e) {  
    e.preventDefault(); 
    var data = $(this).mouseout().data('maphilight') || {}; 
    data.alwaysOn = !data.alwaysOn; 
    $(this).data('maphilight', data).trigger('alwaysOn.maphilight'); 
}) 

Answer 1

Найдено решение, которое может работать для меня:

.bind('click.maphilight', function(e) {  
        $(this).data('maphilight', { 
          alwaysOn: true 
        }).trigger('alwaysOn.maphilight'); 
        //check if area wasnt already selected - otherwise gets buggy 
        if(!$(this).hasClass('selected')){ 
         $('.selected').data('maphilight', { 
          alwaysOn: false 
         }).trigger('alwaysOn.maphilight'); 
         $('#map-tag area').removeClass('selected'); 
         $(this).addClass('selected'); 
        } 
       }) 

Answer 2

Для дальнейшего использования этого лучше всего работает.

// Turn off all 
$("area").data('maphilight', { alwaysOn: false }).trigger('alwaysOn.maphilight'); 

// Turn on one 
$("area[data-id=" + id + "]").data('maphilight', {alwaysOn: true}).trigger('alwaysOn.maphilight');