javascript - 多次调用 jQuery 函数

Question

所以，我在 jQuery 中有这个函数:

$(function(){ 
$( ".unfocused" ).click(function ClickHeader () {
    $( this ).addClass( "focused" );
    $( this ).removeClass( "unfocused" );
    $(".header").not(this).addClass( "unfocused" );
    $(".header").not(this).removeClass( "focused" );
});
});

第一次单击标题时，它工作得很好，但当我尝试单击另一个未聚焦的标题时，该功能不再起作用。是因为它运行在document .ready上吗？
感谢您的帮助!

Answer 1

改成这样:

  $( document ).on("click", ".unfocused", function() {
    $( this ).addClass( "focused" );
    $( this ).removeClass( "unfocused" );
    $(".header").not(this).addClass( "unfocused" );
    $(".header").not(this).removeClass( "focused" );
  });

这基本上是在文档上注册事件。单击标题时，事件会冒泡到文档。在那里，给定的选择器被验证并在需要时执行函数。