只运行一次javascript函数

Question

我有这个简单的javascript函数：

<script type="text/javascript">
    var popup = '0';
    if(popup == '0') {
       $(document).ready(function () {     
            $(document).on('click', '.button', function(){
                  alert('test');
                  popup = '1';
            });
       }); 
    }
</script>

<button class="button">Test</button>

我希望函数仅在第一次单击时发出警报但它仍然有效，尽管我将popup的值更改为1

Answer 1

你需要的是.one()函数。 它确保代码仅为您触发一次。

文档： http ： //api.jquery.com/one/

文档示例：

$( "#foo" ).one( "click", function() {
  alert( "This will be displayed only once." );
});

Answer 2

编写代码如下：

<script type="text/javascript">
    var popup = '0';

     $(document).ready(function () {     
          $(document).on('click', '.button', function(){
             if(popup == '0') {
                alert('test');
                popup = '1';
             }
          });
     }); 
</script>

设置单击侦听器后，之前的if语句的位置不再执行。 只有点击功能里面的代码。

或者，您可以取消绑定onClick侦听器，而不是设置popup = '1' 。 请尝试以下方法：

<script type="text/javascript">
    var popup = '0';

     $(document).ready(function () {     
          $(document).on('click', '.button', function(){
              alert('test');

              //unbinds *all* listeners previously registered on "document"
              $(document).unbind('click');
          });
     }); 
</script>

更简洁，就像Mathletics所提到的那样，可以清除内存中不必要的回调。

Answer 3

尝试：

<script type="text/javascript">
    var popup = '0';

       $(document).ready(function () {     
            $(document).on('click', '.button', function(){
                if(popup == '0') {
                  alert('test');
                }
                  popup = '1';
            });
       }); 
</script>

你有一个将弹出窗口设置为1的功能但从未再次检查其值。 这样它就会被检查并且应该正常工作。