1

以下のスクリプトでは、slideToggleのスコープを、クラスが一致する要素の子要素に制限するために、親コンテナのIDへの参照を渡そうとしています。

IDを渡すようにコードを変更するにはどうすればよいですか？問題は、「myID.extras」が明らかに適切な構文ではないことです。

jQuery(document).ready(function()
{
    jQuery(document).on('click','.toggleExtras', function(e){
        var myEl = jQuery(this).closest('.widget');
        var myID = jQuery(myEl).attr('id');
        jQuery('myID .extras').slideToggle();
        jQuery(this).text(function(el, old){
            return old == "Show Advanced Options" ? "Hide Advanced Options" : "Show Advanced Options";
        });
    });

});

HTML：

<div id="widget-43_my_box_cats-4" class="widget">   
    <div class="widget-top">
        <div class="widget-title-action"></div>
        <div class="widget-title"><h4>Widget Title<span class="in-widget-title"></span></h4></div>
    </div>

    <div class="widget-inside" style="display: block;">
        <form action="" method="post">
            <div class="widget-content">
                <p>
                    <label for="widget-my_box_cats-4-title">Title:</label>
                    <input class="widefat" id="widget-my_box_cats-4-title" name="widget-my_box_cats[4][title]" type="text" value="">
                </p>

                <fieldset><legend><span class="toggleExtras">Hide Advanced Options</span></legend>
4

2 に答える 2

2

Why get the ID, and do a lot of beating around the bush, when you can just find the element directly:

jQuery(document).ready(function() {
    jQuery(document).on('click','.toggleExtras', function(e){

        jQuery(this).closest('.widget').find('.extras').slideToggle();

        jQuery(this).text(function(el, old){
            return old == "Show Advanced Options" ? "Hide Advanced Options" : "Show Advanced Options";
        });
    });
});
于 2013-02-26T13:27:17.943 に答える
0

jQuery('myID .extras').slideToggle();する必要がありますjQuery('#myID .extras').slideToggle();

id selecorの場合、プレフィックスを使用する必要があります#。タグ名を持つ要素を検索myIDする要素セレクターですmyID

于 2013-02-26T13:18:58.047 に答える