调整大小后,窗口重新调整大小事件会中断切换

时间:2013-10-01 23:10:06

标签: javascript jquery

我遇到以下代码的问题。我为切换div创建了一个窗口重新调整大小的事件。目的是这样,当在较小的设备上时,标题将切换内容,否则内容将按原样显示。我遇到的问题是当我刷新页面时,它完美无缺。第二个我调整它并单击以切换,它会导致某种递归调用5次,因此它来回切换5次。有什么建议?

$(window).resize(function() {
if ($(window).width() > 767) {
  $(".toggle" ).show();
}
else {
  $(".toggle" ).hide();

      $( ".opener" ).click(function() {
    $(this).next('.toggle').slideToggle();
  });
}

}).resize();

1 个答案:

答案 0 :(得分:0)

不建议在调整大小函数中插入单击函数,因为每次调整大小时都会向标记添加单击函数。如果在点击线之前向“开启者”添加一个解除绑定,它应该可以工作。

$(window).resize(function() {
   if ($(window).width() > 767) {
   $(".toggle" ).show();
}
else {
   $(".toggle" ).hide();
   $( ".opener" ).unbind("click");  
   $( ".opener" ).click(function() {
     $(this).next('.toggle').slideToggle();
   });
}

}).resize();