只运行一次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所提到的那样,可以清除内存中不必要的回调.