Открыть модал внутри Jquery

Question

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

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

Это нормально на данный момент. Но я также хотел бы добавить функцию щелчка к нему, но для жизни я не могу понять, как. Большая часть данных, кажется, хранится в файле 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: или если это вообще возможно?

Answer 1

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

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

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