как вы получаете ссылку на внешний div с помощью jquery

Question

если у меня есть этот HTML

<div class="whole">This is a <div class="min">Test</div></div>

Я хочу изменить html «целого» div, когда я нажимаю на «min» div:

Я попробовал это ниже, но, похоже, это не работает.

$(document).ready(function() {
    $('div.min').live('click', function() {
         $(this).prev('.whole').html("<img  BORDER=0 src='../../images/copy1.png' />");
    });
});

У кого-нибудь есть идеи, что здесь происходит не так?

Answer 1

Вы хотите parent, а не prev. Ваш div.min находится внутри, а не рядом с div.whole. Итак:

$(document).ready(function() {
    $('div.min').live('click', function() {
         $(this).parent('.whole').html("<img  BORDER=0 src='../../images/copy1.png' />");
    });
});

---

2017 обновление: live устарело в течение многих лет и в конечном итоге было удалено. Он используется выше, потому что он был в исходном коде OP и не был проблемой, но просто для полноты, текущий способ сделать это с подписью делегирования on:

$(document).on('click', 'div.min', function() {
     $(this).parent('.whole').html("<img  BORDER=0 src='../../images/copy1.png' />");
});

Обратите внимание, что нам даже не нужен ready, так как он выполняет делегирование событий на document, поэтому ждать не нужно. (Это также относится и к версии live выше.)

Answer 2

.prev() выберет предшествующего брата , то есть элемент, который предшествует текущему элементу на того же уровня .
Вы ищете .parent().

* 1014 Е.Г. *

<div id="parent">
    <div id="first"></div>
    <div id="second"></div>
</div>

• $('#second').prev() выберет #first.
• $('#second').parent() выберет #parent.
• $('#first').next() выберет #second.

Answer 3

Другим способом сделать это было бы следующее

$('div.min').click(function(event){
   if ($(event.target).is('div.min')){
        $('div.whole').html("<img  BORDER=0 src='../../images/copy1.png' />");
        }
});​