Question

在被解雇一次后，是否有删除if语句？

我有一个菜单容器，在页面加载时显示，所以当用户滚动1px时它会滑开。我不希望浏览器不断跟踪scrollTop()方法，因为这会影响性能。

在使用一次if语句后删除或取消jQuery(document).ready(function($) { $(window).scroll(function() { if ($(document).scrollTop() > 1) { $('.menubox').css('left', '-25%'); } }); $('.mybutton').on('click', function() { $('.menubox').css('left', '0%'); }); });语句的最佳方法是什么？

代码如下，我在这里有一个codepen：http://codepen.io/emilychews/pen/evbzMQ

＆＃13;

body {
  margin: 0;
  padding: 0;
  height: 200vh;
}

.menubox {
  top: 100;
  position: fixed;
  width: 20%;
  height: 100%;
  background: red;
  padding: 10px;
  color: white;
  transition: all 1s;
}

.mybutton {
  position: fixed;
  left: 40%;
  top: 50px;
  padding: 5px 10px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="menubox">Menu Box</div>
<button class="mybutton">menu</button>

＆＃13;

ListBox

＆＃13;

Answer 1

您可以在off()语句中调用if来删除事件处理程序。

另请注意，如果您担心性能，可以去除事件处理程序，以便只有在滚动停止N ms后才会执行逻辑：

var scrollTimer;

$(window).scroll(function() {
  clearTimeout(scrollTimer)
  scrollTimer = setTimeout(function() {
    if ($(document).scrollTop() > 1) {
      $('.menubox').css('left', '-25%'); 
      $(window).off('scroll');
    }
  }, 150);
});

Answer 2

听起来你实际上有两个条件。一个是基于滚动位置，另一个是基于某个要跟踪的状态。所以只需添加一个变量来跟踪该状态。也许是这样的：

var scrolled = false;

$(window).scroll(function() {
    if ( !scrolled && $(document).scrollTop() > 1) { // check the state
        $('.menubox').css('left', '-25%');
        scrolled = true; // update the state
    }
}); 


$('.mybutton').on('click', function() {
    $('.menubox').css('left', '0%');
    scrolled = false; // don't forget to reset the state
});

触发一次后删除一个If语句

2 个答案: