Question

以下是这种情况：我想仅对选定的元素使用jQuery事件委派。

HTML

<div id="result"></div>
<table id="table1">
<tr>
    <td>
        <span class="cell">Item1.0</span>
    </td>
    <td>
        <span class="cell">Item1.1</span>
    </td>
    <td>
        <span class="cell">Item1.2</span>
    </td>
    <td>
        <span class="cell">Item1.3</span>
    </td>
</tr>
<tr>
    <td>
        <span>Item2.0</span>
    </td>
    <td>
        <span>Item2.1</span>
    </td>
    <td>
        <span>Item2.2</span>
    </td>
    <td>
        <span>Item2.3</span>
    </td>
</tr>
<tr>
    <td>
        <span class="cell">Item3.0</span>
    </td>
    <td>
        <span class="cell">Item3.1</span>
    </td>
    <td>
        <span class="cell">Item3.2</span>
    </td>
    <td>
        <span class="cell">Item3.3</span>
    </td>
</tr></table>

JS

$("#table1").on("click", "td span.cell", function() {    
result.html($(this).html()); });

我需要仅在那些跨度为“cell”类的TD上连接click事件。这意味着第二行的TD不应该有点击事件绑定。有什么提示吗？

Answer 1

使用:has()选择器

$("#table1").on("click", "td:has(span.cell)", function() {    
    result.html($(this).html()); 
});

演示：Fiddle

在所选元素上使用jQuery事件委托

1 个答案: