1

在下面的脚本中，我试图传入对父容器 ID 的引用，以便将 slideToggle 的范围限制为该元素的类匹配的子元素。

如何更改代码以传递 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

当您可以直接找到元素时，为什么要获取 ID，并绕圈子做很多事情：

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 回答