jQuery получает идентификатор активного изображения

Question

Я застрял на каком-то jquery, и я не знаю, почему он не работает ...

$('img').click(function() {
    $('img').removeClass('bob');
    $(this).addClass('bob');
});

var test = $('img.bob').attr('src');
$('div.button').click(function() {
    alert(test);
});

в основном мне нужно получить attr ID выбранного изображения, но предупреждение только возвращает 'null'.

Любые предложения будут с благодарностью.Я выдергиваю свои волосы ...

A.

Answer 1

Помните, что назначенное вами событие click не будет выполняться до тех пор, пока вы на самом деле не нажмете <img>, поэтому попытка получить изображение с классом .bob до того, как какие-либо события щелчка произойдут в элементах <img>, приведет в 0 совпадающих элементах (если только вы не присвоили .bob одному из элементов <img> до загрузки страницы.

Вам необходимо получить 'id' внутри обработчика нажатия кнопки.

Кроме того, вы можете сделать свой код немного более эффективным, кэшируя найденные элементы <img> (если вы не добавляете дополнительные элементы динамически после загрузки страницы).

var $img = $('img').click(function() {
    $img.not(this).removeClass('bob');
    $(this).addClass('bob');
});

$('div.button').click(function() {
    var test = $img.filter('.bob').attr('id');
    alert(test);
});

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

$('img').click(function() {
    $('img').not(this).removeClass('bob');
    $(this).addClass('bob');
});

$('div.button').click(function() {
    var test = $('img.bob').attr('id');
    alert(test);
});

Answer 2

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

$('div.button').click(function() {
    alert(this.id.ToString());
});