open modal inside Jquery

Question

我继承了一个项目，它需要一些修改，但我不能找出所有已经做过的事情和为什么。

基本上它是一个被分割成区域的地图。当鼠标移到区域a上时，该区域会改变颜色并弹出工具提示。

现在还可以。但我也想添加一个点击功能，但对于我的生活，我不知道如何。大多数数据似乎都存储在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插件来处理你的地图。我从他们的文档中得到了这个代码片段;它增加了处理地图事件的函数(如"click")。您应该将它添加到您的代码中，就在attrsHover: { ...... },部分之后。

希望对你有帮助。

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