UI可排序字段中的可点击链接

Question

我正在为wordpress创建高级自定义字段插件的自定义字段。 现在我已经能够允许在字段内使用javascript，但该字段具有UI可排序的活动，这使得我的锚标记不会激活，而是点击可排序的锚点。

有没有办法确保我的click事件在可排序元素中被触发？

所以我创建了这个链接，放在一个元素中：

<a id="addTable" href="#">Voeg tabel toe</a>

这会变成这样的元素：

<div id="normal-sortables" class="meta-box-sortables ui-sortable">
  <div id="acf-group_5a93d53605864" class="postbox  acf-postbox seamless">
    <button type="button" class="handlediv" aria-expanded="true">
      <span class="screen-reader-text">paneel Bridge verbergen</span>
      <span class="toggle-indicator" aria-hidden="true"></span>
    </button>

    <h2 class="hndle ui-sortable-handle">
      <span>Bridge</span>
      <a href="{link}/wp-admin/post.php?post=12695&amp;action=edit"
         class="dashicons dashicons-admin-generic acf-hndle-cog acf-js-tooltip"
         title="Bewerk groep">
      </a>
    </h2>

    <div class="inside acf-fields -top">
      <div class="acf-field acf-field-Bridge acf-field-5a93d538671c7"
           data-name="bridge"
           data-type="Bridge" data-key="field_5a93d538671c7">
        <div class="acf-label">
          <label for="acf-field_5a93d538671c7">Bridge</label>
        </div>

        <div class="acf-input">
          <!-- Here is the anchor tag -->
          <a id="addTable" href="#">Voeg tabel toe</a>

          <div id="ContentWrapper">
            <div id="North"></div>
            <div id="East"></div>

            <div id="Middle">
              <table bgcolor="#c0c0c0">
                <tbody>
                  <tr>
                    <td colspan="3" align="center"><strong>N</strong></td>
                  </tr>

                  <tr>
                    <td align="left"><strong>W</strong></td>
                    <td>&nbsp;</td>
                    <td align="right"><strong>O</strong></td>
                  </tr>

                  <tr>
                    <td colspan="3" align="center"><strong>Z</strong></td>
                  </tr>
                </tbody>
              </table>
            </div>

            <div id="South"></div>
            <div id="West"></div>
          </div>
        </div>
      </div>

      <script type="text/javascript">
        if ( typeof acf !== 'undefined' ) {

          acf.postbox.render({
            "id": "acf-group_5a93d53605864",
            "key": "group_5a93d53605864",
            "style": "seamless",
            "label": "top",
            "edit_url": "http:\/\/{link}\/wp-admin\/post.php?post=12695&action=edit",
            "edit_title": "Bewerk groep",
            "visibility": true
          });	

        }
      </script>
    </div>
  </div>
</div>

(function($) {
  $("#addTable").click(function () {
    alert( "Click" );
  });
})(jQuery);