你如何使用jquery获得对外部div的引用

Question

如果我有这个HTML

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

我想点击"min"div时更改"整个"div的html:

我在下面尝试了这个,但似乎没有用.

$(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().

例如

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

• $('#second').prev()将选择#first.
• $('#second').parent()将选择#parent.
• $('#first').next()将选择#second.