2015-10-08 4 views
0

Я унаследовал проект, и ему нужны некоторые поправки, но я не могу решить все, что было сделано почему.open modal внутри JQuery

В основном это карта, разделенная на регионы. Когда вы наводите указатель мыши на область, регион меняет цвет и всплывает всплывающая подсказка.

Это нормально. Но я также хотел бы добавить функциональность клика, но для жизни я не могу понять, как это сделать. Большая часть данных, как представляется, сохраняются в файле JS:

jQuery(function($) { 
     $(function() { 
      debugger; 
      $("#unmaskUKMap").mapael({ 
        map: { 
        // Set the name of the map to display 
        name: "uk_new", 
        defaultArea: { 
         attrs: { 
         stroke: "#fff", 
         "stroke-width": 1, 
         "fill": "#D0D0D0" 
         }, 
         attrsHover: { 
         "stroke-width": 2, 
         "fill": "#0065AE" 
         } 
        } 
        }, 
        areas: { 
        "wales": { 
         href: "#", 
         tooltip: { 
         content: "<h3>Wales</h3>" + 
          "Number of insolvencies" + 
          "<ul>" + 
          "<li><span class='quarter'>Q1 2014: </span><span>134</span></li>" + 
          "<li><span class='quarter'>Q1 2015: </span><span>137</span></li>" + 
          "</ul>" + 
          "<ul>" + 
          "High Risk Sectors" + 
          "<li>Services</li>" + 
          "<li>Construction</li>" + 
          "<li>Retail</li>" + 
          "</ul>" 
         } 
        }, 

Так как вы можете видеть вас мышь над подсказка всплывает и это окрашивает область.

Что бы я хотел сделать, так или иначе, чтобы вызвать модаль для открытия при нажатии.

Обычно я хотел бы использовать:

<a href="#myModalBigDataSearching" role="button" data-toggle="modal"</a> 

Хотя в данном случае я не нужна кнопка, так что я думаю, я удалить роль часть.

Я не могу добавить это ни к одной из областей, так как она нарушает остальную часть кода, и я не могу найти, как добавить ее в раздел href: либо, если это возможно?

ответ

0

похоже, что вы используете плагин jQuery Mapael для обработки ваших карт. Я получил этот фрагмент кода из их документации; он добавляет функции для обработки событий на вашей карте (например, «щелчок» в соответствии с примером). Вы должны добавить его в свой код сразу после раздела attrsHover: { ...... },.

Надеюсь, это поможет.

eventHandlers: { 
    click: function (e, id, mapElem, textElem) { 
     // YOUR CODE HERE 
    } 
}, 
+0

Большое спасибо. Но, очевидно, есть несколько регионов. Как мне заставить его открыть другой модальный режим в зависимости от региона? – user3105661

+0

обработчик click-event передает вам объект 'mapElem', это ссылка на конкретный регион, который будет нажат. для получения дополнительной информации, взгляните на это: http://jsfiddle.net/neveldo/qGwWr/ –

+0

Это большое спасибо за вашу помощь – user3105661