如何仅针对嵌套标记，而不是所有其他标记

Question

简单的slideToggle on jQ Mobile app - 无法正确过滤。

<h4 class="trigger">Title 1<span> [ + ]</span>
<div class="formGroup">
 //form stuff
</div>

<h4 class="trigger">Title 2<span> [ + ]</span>
<div class="formGroup">
 //form stuff
</div>

大约有16个这样的团体，但你明白了。 .formGroup由CSS display：none。

隐藏

使用以下代码，它会更改每个h4＆gt;的范围文本。每次点击页面上的跨度。

$( document ).on( "pageinit", "#personnelPage", function( event ) {
    $('h4.trigger').click(function(){
        $(this).next('.formGroup').slideToggle('fast', function(){
            $('h4.trigger').find('span').text($(this).is(':visible') ? '[ - ]' : '[ + ]');
        });

    });
});

THX

Answer 1

我假设您要定位单击的h4元素，在这种情况下，您可以使用变量来保存对该对象的引用，然后在slideToggle回调中使用它

$(document).on("pageinit", "#personnelPage", function (event) {
    $('h4.trigger').click(function () {
        var $this = $(this)
        $this.next('.formGroup').slideToggle('fast', function () {
            $this.find('span').text($(this).is(':visible') ? '[ - ]' : '[ + ]');
        });

    });
});