防止JavaScript函数重复执行

Question

我正在使用JavaScript、jQuery和PHP。如何限制JavaScript函数只执行一次？

我的MainJQuery文件有Ajax。display.php会执行一段时间：

....

$.ajax({
    type:'POST',
    url: 'display.php',
    data:'id='+id  ,
    success: function(data){
        $("#response").html(data);

        //Here Get_list should be execute only once.
        get_list('get');

        // Display should execute as usual
        display();
    }//success
}); //Ajax

.......

get.Php文件将一个值写入JavaScript：

<?php
    print "<script language='javascript'>";
    print " g_cost[g_cost.length]=new Array('STA-VES','East',4500);";
    print " g_cost[g_cost.length]=new Array('STA-CRF','West',5400);";
    print "</script>";
?>

我的JavaScript函数从PHP获取了以下值：

function get_list('get'){
    for(var i=0;i<g_cost.length;i++)
        var temp = g_cost[i];

    var Name = temp[0];
    var direction = temp[1];
    var cost = temp[2];

    ..
    some code
    ...
}

function display(){
    for(var i=0;i<g_cost.length;i++)
        alert(g_cost.length);
    var temp = g_cost[i];
    alert(temp[0]);
    alert(temp[1]);
    alert(temp[2]);
}

在jQuery Ajax成功部分中，有没有可能限制执行JavaScript函数？

- venkatachalam

---

可能是仅运行JavaScript函数一次的重复问题。 - Basilevs

Answer 1

在jQuery中，您可以使用 .one() 函数绑定一个方法，该方法仅执行一次。例如，

$("#someAnchorId").one("click", function(){
    //Ajax method here 
});

请查看jQuery one 帮助主题。

- redsquare

Answer 2

您可以用一个空函数替换该函数 - 这本质上与Rene Saarsoo的解决方案相同，但看起来更好:

var get_list = function(param1, param2, ...) {
     // your code here
     get_list = function() {};
};

- weirdan

---

在“// your code here”部分，您可以放置只运行一次的代码，在子函数部分则放置每次运行的代码。 - jmav

最好使用 get_list = Function('') 来避免内存泄漏。 - CMCDragonkai

Answer 3

三种选项：

1. 在全局范围内设置一个布尔标志，在成功运行后将其设置，并在运行之前进行检查

2. 在成功运行后，禁用按钮（或任何您用于调用一次性方法的控件）

3. 稍微不太优先，但也可以在服务器端执行验证，即每次调用该方法，但在服务器端验证。好处是这将确保服务器上的数据一致性。

- Yuval A

---

引入全局变量是一个不好的主意。 - Rene Saarsoo

Answer 4

创建一个只执行一次的函数的方法：

get_list = (function(){
  var counter = 0;
  return function(param1, param2, ...) {
    if (counter > 0) {
      return;
    }
    counter++;

    // your normal function code here
  };
})();

这几乎与使用全局变量来跟踪函数执行次数相同，只是我们创建一个变量，只有内部函数可以看到。之后，您可以像任何其他函数一样使用它来获取列表。

这可能可以重构为更通用的函数原型，以便可以像这样使用：

get_list = (function (param1, param2, ...) {
  ...
}).once();

- Rene Saarsoo

Answer 5

最快的方法是在成功声明中添加一行额外的代码：

$.ajax({
    type:'POST',
    url: 'display.php',
    data:'id='+id  ,
    success: function(data){
        if(!arguments.callee.stop){ arguments.callee.stop = true; }else{ return; }

        $("#response").html(data);
        //Here Get_list should be execute only once   
        get_list('get');

        // display should execute as usual  
        display();

    }//success
}); //ajax

- tableton

Answer 6

尝试在成功调用后禁用Ajax触发器（链接，按钮等）。

触发器示例：

<a id="ajax_trigger" href="#" onclick="yourAjaxCall(); return false;">Get List</a>

...

success: function(data){
    $("#response").html(data);
        //Here Get_list should be execute only once
         get_list('get');

        // Some code to disable, or hide #ajax_trigger
        // in other words, make it unclickable or disappear.
        $("#ajax_trigger").css('display': 'none'); // IIRC

        // Display should execute as usual
        display();
}//success

- andyk