JQuery, используя ЭТО как .on [селектор]

Привет,
Итак, у меня есть этот код:

$(document).on('click', ".buttonSelectAllOpt", function () {
alert(this.attr("id"));
});

и PHP:

$iii=1
while([...]){
echo "<span class=\"buttonSelectAllOpt\" id=\"buttonSelectAllOpt$iii\">Some text</span>";
$iii++;
}

Я хочу, чтобы это было .buttonSelectAllOpt, но
похоже, что это относится к документу, а не к селектору.
Вы знаете, могу ли я как-то вызвать селектор?

2

Решение

this в вашем примере будет ссылаться на .buttonSelectAllOpt элемент, по которому щелкнули, однако вам нужно обернуть его в объект jQuery для доступа к attr() метод. Попробуй это:

$(document).on('click', ".buttonSelectAllOpt", function () {
alert($(this).attr("id"));
});

Пример скрипки

2

Другие решения

this будет ссылаться на выбранный элемент, поэтому попробуйте выбрать фактический элемент:

$('.buttonSelectAllOpt').click(function () {
alert($(this).attr("id"));
});

Также обратите внимание, что .click является предпочтительным сокращением для .on('click'), Присоединение события к реальному объекту (вместо документа) также происходит быстрее.

Видеть это JSFiddle.

1

Используйте либо this.id или же $(this).attr('id'), Внутренние обработчики событий, this является элементом DOM, поэтому вы можете напрямую обращаться к его свойствам. Если вы хотите использовать JQuery .attr() метод, вам нужно обернуть его в объект jQuery.

0

Вот альтернативный ответ, так что вам не нужно регистрировать событие в самом документе …

Попробуйте создать такой метод:

var initBtnHandler = function () {
$('a.buttonSelectAllOpt').on('click', function() {
alert($(this).attr('id'));
});
}

Затем, после завершения вашего AJAX, просто перерегистрируйте событие, вызвав функцию:

$.ajax({
url: 'yourUrl',
type: 'post',
success: function () {
// do something
},
complete: function() {
initBtnHandler();
}
});

Теперь ваши новые предметы будут зарегистрированы с помощью обработчика событий.

0
По вопросам рекламы [email protected]