Question

我正在努力弄清楚如何制作一个元素，当我在click切换时，jQuery在页面最初加载时崩溃了。目前所有东西都是开放的 - 与我需要的完全相反。

请记住我是初学者，有人可以帮助我吗？谢谢。

// Toggle       
$('.togglehandle').click(function() {
    $(this).toggleClass('active');
    $(this).next('.toggledata').slideToggle();
});

// alert close 
$('.clostalert').click(function(){
    $(this).parent('.alert').fadeOut ();
    $('#options').hide();
});

Answer 1

首先，请记住在CSS中将".toggledata"元素设置为display: none。

另外，请确保您发布的两个处理程序都包含在$(document).ready()中。换句话说，请确保您具有以下内容：

$(document).ready(function() {
    // Toggle       
    $('.togglehandle').click(function() {
        $(this).toggleClass('active');
        $(this).next('.toggledata').slideToggle();
    });

    // alert close 
    $('.clostalert').click(function(){
        $(this).parent('.alert').fadeOut ();
        $('#options').hide();
    }); 
});

只是因为你提到你是一个初学者..........这里只需要一点代码清理;）

$(document).ready(function() {
    // Toggle       
    $('.togglehandle').on('click', function() { //1: .click() -> .on('click',
        var $this = $(this); //2: $(this) -> var $this = $(this)
        $this.toggleClass('active');
        $this.next('.toggledata').slideToggle();
    });

    // alert close 
    $('.clostalert').on('click', function(){
        $(this).parent('.alert').fadeOut(); //3: No change
        $('#options').hide();
    }); 
});

更改说明：

将.click()更改为.on('click'...

.click()方法只是.on('click'...方法的简写。使用长格式并不比速记有任何好处，除了它标准化你的处理程序绑定并有更多的参数选项（比如使用委托事件，你将来可能会这样做）。
将$(this)更改为var $this = $(this)

这部分有时难以理解。首先，要了解jQuery本身实际上是一个函数对象。 jQuery的开发人员为库提供了两个名称，在编码时可以互换使用：$和jQuery。

换句话说，以下两者实际上是等价的：
```
$('.toggledata').slideToggle();
```
和
```
jQuery('.toggledata').slideToggle();
```
这很重要，因为必须记住$本质上是一个函数名，与其他名称一样。因此，每次调用$(this)时，您实际上都在调用＆＃34;构造函数＆＃34;函数初始化一个新的jQuery对象。因此，为了提高代码效率，我们将$(this)存储在变量中，以便可以重复使用。

变量名$this只是一个惯例（一个你应该习惯使用的好习惯）。将带有美元符号的jQuery对象的任何变量的名称加上前缀是一种常见的约定。例如，如果我们将$('.clostalert')存储在变量中，那么我们会执行以下操作：
```
var $clostalert = $('.clostalert');
```
请注意，我们不打算将$(this)存储在第二个处理程序中的变量中，因为它仅使用一次，因此只在那里调用$(this)。
< / LI>

如何设置我在切换时切换为折叠的元素

1 个答案: