Использование делегирования событий jQuery для выбранных элементов

0

Вот ситуация: я хочу использовать делегирование событий 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()); });

Мне нужно подключить событие click только для тех TD, которые имеют диапазон с классом "cell". Это означает, что TDs второй строки не должны иметь привязки события клика. Какие-нибудь советы?

Теги:

1 ответ

1
Лучший ответ

использование : имеет() селектор

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

Демо: скрипка

  • 0
    Обычно я избегаю jQuery-добавленных селекторов, но они отлично работают при подключении делегированных click .
  • 0
    Спасибо Арун. Работает абсолютно нормально.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню