события jquery для динамически загружаемого контента

Я пытаюсь добавить событие клика к некоторому динамически загружаемому контенту, и у меня есть это:

        $("#dailyCount table thead th").each(function(){
        var yd = "#" + $(this).attr("id");
        $(document).on("click", yd, function(){
            alert("a");
        });

    });

Идентификатор элемента от 1 до последнего дня текущего месяца. Любые идеи ?


events jquery listeners
person ardb    schedule 19.03.2014    source источник
comment
Не размещайте делегированное событие внутри каждого цикла. Является ли #dailyCount динамическим элементом? Почему бы не использовать здесь класс и не отфильтровать его, например, по индексу?   -  person A. Wolff    schedule 19.03.2014
comment
Вы должны были использовать встроенный onclick()!   -  person Dhaval Marthak    schedule 19.03.2014
comment
@DhavalMarthak может быть решением, но точно не лучшим.   -  person A. Wolff    schedule 19.03.2014

Ответы (4)


arrow_upward
1
arrow_downward

Вместо добавления делегированного обработчика для каждого элемента вы можете использовать одно делегирование для всех элементов, возвращаемых вашим селектором.

Поэтому постарайтесь:

$(document).on("click", "#dailyCount table thead th", function(){
    alert("a");
});

Демонстрация: http://jsfiddle.net/agLBm/

person Irvin Dominin    schedule 19.03.2014
comment
Не работает :(. Каждый th имеет разные идентификаторы от 1 до 30. - person ardb; 19.03.2014
comment
Ты это пробовал? Ваш селектор укажет все ваши th, идентификатор не имеет значения, посмотрите демо: jsfiddle.net/agLBm - person Irvin Dominin; 19.03.2014
comment
Я думаю, что я делаю это как-то неправильно. В любом случае спасибо, я разберусь с этим позже! - person ardb; 19.03.2014
comment
Я попытался поместить класс в элементы и добавить такие события: $(document).on(click, .dailyCountDel, function(){ alert(a); }); , но он все еще не работает, и я не получаю никаких ошибок .. - person ardb; 19.03.2014
comment
Это была ошибка Chrome, я перезапустил его и работал. Спасибо! - person ardb; 21.03.2014

arrow_upward
0
arrow_downward

Попытка делегировать событие с использованием идентификатора, который вы получаете динамически, аналогична попытке прикрепить событие к самому динамическому элементу.

Поэтому либо поместите свой код в функцию document.ready, либо жестко закодируйте идентификатор динамических элементов.

person Banana    schedule 19.03.2014

arrow_upward
0
arrow_downward

Просто попробуйте это:

$(document).on("click", "#dailyCount table thead th", function(){
    alert("a");
});

Хотя на вашем месте я бы ушел от DOM с помощью селекторов. Просто добавьте некоторый класс к элементам TH в вашей таблице и выберите их.

<div id="dailyCount">
    <table>
        <thead>
            <th class="dailyCount-table-headCell">Whatever</th>
        </thead>
    </table>
</div>

$(document).on("click", ".dailyCount-table-headCell", function () {
    console.log("a");
});

Это позволит вам изменить разметку без изменения JS. Как будто вам нужно будет сделать сетку вместо таблицы.

person Vladislav Qulin    schedule 19.03.2014

arrow_upward
0
arrow_downward

Предполагая, что вы будете использовать идентификатор дальше в коде, попробуйте следующее:

$("#dailyCount table thead th").on("click", function(){
 var id = $(this).attr('id'); // id will now have the id of clicked element.
 alert("a");
});

Надеюсь это поможет.

person Rishabh Shah    schedule 19.03.2014