父级中的jQuery目标元素

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 />');
});

我想在父级中使用类.name来定位span,但什么也没发生？

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 />');
});

where parent是您正在侦听的实际元素的父级,在您的情况下mali_oglasi,如果a要在其中添加,则可以是父级div