父对象中的jQuery target元素

Question

我有这样的结构

<div id="mali_oglasi">
    <p class="mali_oglas">
        <span class="name">Predaja7</span>
        <span class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec urna eros, viverra nec porta vitae, luctus at ipsum. Pellentesque porta imperdiet purus, at pellentesque nisl lacinia et. Nam id justo do</span>
        <span class="contact_author">Saša</span>
        <span class="date_created">2012-03-13 14:36:30</span>
        <span class="date_expires">2012-04-12 14:36:30</span>
        <span class="email">imalimalomrk@gmail.com</span>

        <span>Pirot</span>

        <span>Auto i Moto</span>
                                                                                                   <a class="obrisi" id="16">Obrisi</a>
        <a class="izmeni" id="16">Izmeni</a>
    </p>
    <p class="mali_oglas">
        <span class="name">Predaja6</span>

        <span class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec urna eros, viverra nec porta vitae, luctus at ipsum. Pellentesque porta imperdiet purus, at pellentesque nisl lacinia et. Nam id justo do</span>
        <span class="contact_author">Saša</span>
        <span class="date_created">2012-03-13 14:36:19</span>
        <span class="date_expires">2012-04-12 14:36:19</span>
        <span class="email">imalimalomrk@gmail.com</span>
        <span>Pirot</span>

        <span>Auto i Moto</span>
                                                                                                   <a class="obrisi" id="15">Obrisi</a>
        <a class="izmeni" id="15">Izmeni</a>
    </p>.....           
</div>

和JS：

$('.izmeni').on('click', function() {
    $(this).closest('.name').replaceWith('<input />');
});

我想在父类中以class .name为目标跨度，但是什么也没有发生？？？

Answer 1

您可以使用“ closest从当前元素开始，然后向上遍历DOM树。

使用siblings对象将您的元素指定为姐妹和兄弟（具有相同父元素的其他DOM元素）：

$('.izmeni').on('click', function() {
    $(this).siblings('.name').replaceWith('<input />');
}); 

注意：我不确定您是否以正确的方式使用on()方法... on()方法应该附加到在DOM加载后添加的对象的父元素上，例如：

$(parent).on('click', '.izmeni', function() {
    $(this).siblings('.name').replaceWith('<input />');
});

其中parent是您正在监听的实际元素的父级，在这种情况下，如果要在该div添加a则mali_oglasi可能是父级

Answer 2

$('.izmeni').on('click', function(e) {
    $(e.target).closest('.SomeParent').find('.elementToReplace').replaceWith('<input />');
});

Answer 3

从您的结构.izmeni是.name的同级

看看jQuery兄弟姐妹http://api.jquery.com/siblings/

$('.izmeni').on('click', function() {
    $(this).siblings('.name').replaceWith('<input />');
});