Использование jQuery 'this' с селектором нескольких элементов

Извините jQuery noob question here, Я пытаюсь сделать все элементы div с классом. Thumbnail clickable с функцией обратного вызова. Но, как только один из div (s) этого класса щелкнул, мне нужен конкретный идентификатор данного div, чтобы я мог делать дальнейшие манипуляции с этим конкретным. Я смущен, если я буду использовать «это», чтобы ссылаться на этот конкретный div после его нажатия или если я рассматриваю это неправильно.Использование jQuery 'this' с селектором нескольких элементов

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

Пример Судо Код:

<script> 
$(document).ready(function() { 

    $(".thumbnail").click(function() { 

     //need to get id of thumbnail that was clicked, this is where I am confused  
     var thumbnail_id = $(this).attr('id') 
     alert(thumbnail_id); 

    }); 

}); 

</script> 

<div class=thumbnail" id="1">Tom</div> 
<div class=thumbnail" id="2">Jerry</div> 
<div class=thumbnail" id="3">Sue</div> 
<div class=thumbnail" id="4">Mary</div> 
<div class=thumbnail" id="5">Brian</div>

источник

2013-03-29 korono89

Вы делаете это правильно. – bksi

Идентификатор не должен начинаться с номера, предшествующего HTML5. Убедитесь, что ваш браузер поддерживает это. – elclanrs

В том же ключе, что и elclanrs, если вам нужно использовать целые числа, сохраните их в атрибуте data. Используйте, например, 'class =" thumbnail "data-id =" 1 "' – Ohgodwhy

Неясно, что ваша проблема JQuery есть. Чтобы ответить на заданный вами вопрос, когда объект будет нажат в вашем коде, будет вызываться обработчик click, а this будет установлен на элемент DOM, на который был нажат. Это работает, если есть один объект с классом миниатюр или многими.

Если проблема действительно что ваш HTML является ошибкой, то вы должны добавить недостающую цитату, чтобы изменить это:

<div class=thumbnail" ...

к этому:

<div class="thumbnail" ...

FYI, лучший путь к сделайте это следующим образом. Это устраняет проблему цитаты и использует атрибут данных, а не значение числового идентификатора:

Работа демо: http://jsfiddle.net/jfriend00/8tczB/

<script> 
$(document).ready(function() { 
    $(".thumbnail").click(function() { 
     //need to get id of thumbnail that was clicked, this is where I am confused  
     var thumbnail_id = $(this).data('id'); 
     alert(thumbnail_id); 
    }); 
}); 
</script> 

<div class="thumbnail" data-id="1">Tom</div> 
<div class="thumbnail" data-id="2">Jerry</div> 
<div class="thumbnail" data-id="3">Sue</div> 
<div class="thumbnail" data-id="4">Mary</div> 
<div class="thumbnail" data-id="5">Brian</div>

источник

2013-03-29 22:52:49 jfriend00

Красивые изменения там –

Geez - Я отвечаю на фактический вопрос, который они задали, и я получаю два немедленных downvotes. Приходите на людей. Это не похоже на то, что они дали нам рабочий код, который мы могли бы увидеть, какова настоящая проблема. Как вы знаете, что недостающая цитата была не просто ошибкой в их вопросе, и я ответил на их реальный вопрос. Почему хорошо продуманный ответ здесь получает downvotes. Никто еще не пытался ответить на вопрос, который они задали. – jfriend00

Не согласен полностью, ваш первый ответ (перед редактированием, который является первым абзацем в вашем текущем ответе) не является ответом, должен был быть комментарий. –

вы не думаете эскиз должен быть написан как "thumbnail" и не thumbnail"

источник

2013-03-29 22:52:28 writeToBhuwan

Использование jQuery 'this' с селектором нескольких элементов

ответ

Смежные вопросы