为 JQuery 委托使用标签的 ID答案

【问题标题】：Use ID of a tag for JQuery delegate为 JQuery 委托使用标签的 ID
【发布时间】：2018-01-01 18:01:19
【问题描述】：

我正在使用 JQuery 的 delegate 函数将事件附加到标签。我有以下代码：

<div><g id="a_abc"><a xlink:href=" " xlink:title="&lt;TABLE&gt;"> 
<text text-anchor="start" x="59.1729" y="-35.4537" font-family="font-awesome" font-size="14.00" fill="#000000"></text>
</a> 
</g></div>

我想将一个委托绑定到g 标记中的text 部分，类似这样：

$("div").delegate("g.a_abc", "click",function(){
        ...
    });

有没有办法通过id 属性来做到这一点，或者我们必须有一个class 属性？因为上面的代码不起作用。将选择器设置为class 属性可使javascript 代码正常工作。

【问题讨论】：

你试过“g#a_abc”

标签： javascript jquery html delegates

【解决方案1】：

它只是一个selector，就像其他任何人一样。所以是的，你可以这样做

$("div").delegate("#a_abc", "click", function() {
    // ...
});

（或g#a_abc，如果您想忽略带有id="a_abc" 的元素，如果它不是g 元素。）

旁注：delegate 已被on 取代已有几年，并且在 v3.0 中已弃用。 on 语法反转选择器和事件：

$("div").on("click", "#a_abc", function() {
    // ...
});

【讨论】：

【解决方案2】：

将<text> 标记添加到选择器并使用 id 如果这是你想要的

$("div").delegate("#a_abc text", "click", function() {
     console.log(this)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div>
  <g id="a_abc">
    <a xlink:href=" " xlink:title="&lt;TABLE&gt;">
      <text text-anchor="start" x="59.1729" y="-35.4537" font-family="font-awesome" font-size="14.00" fill="#000000"></text>
    </a>
  </g>
</div>

【讨论】：