1

当您需要处理具有相同事件的两个元素但在这种情况下它变得一团糟时,这是一个经典问题。我正在使用leaflet.js,但会使代码更通用

一个空的 var 声明:

var markerslayer;

第一个绑定事件:

$("#slider").on("valuesChanged", function (e){

      var markers = new Array();
      //check if empty, otherwise resets layer
      if(markerslayer){
         map.removeLayer(markerslayer);
         };

      /*some more code here */
      $.post (a.php file here, {some data}, function(data){
             /* markerslayer array is made here */      
             /* add a layer based on markerslayer array */
             });
      });

第二个绑定事件(与上面的代码相同):

map.on("moveend", function (e){
      
      var markers = new Array();
      //check if empty, otherwise resets layer
      if(markerslayer){
         map.removeLayer(markerslayer);
         };

      /*some more code here */
      $.post (a.php file here, {some data}, function(data){
             /* markerslayer array is made here */      
             /* add a layer based on markerslayer array */
             });
      });

现在因为我认为它们在我第一次运行我的脚本时都是异步的,所以它们都同时运行并且它们创建了两个,尽/* make some divs based on markerslayer array */ ​​管我if一开始就有。

简而言之(我认为)正在发生的事情是:

  1. 我创建了一个空变量
  2. 他们异步运行,所以他们认为它是空的
  3. 他们创造了两个结果而不是一个
  4. 附加:当它们再次被触发时,每个只重置它自己的结果(就像有一个标记层和一个标记层_复制)。
4

2 回答 2

2

问题是您 markerslayer在调用 之前检查是否存在post,这意味着另一个post可以同时返回并创建它:

要解决此问题,请将您的删除代码移动到post回调中:

$.post (a.php file here, {some data}, function(data){
    if(markerslayer){
        map.removeLayer(markerslayer);
    };
    /* markerslayer array is made here */  
    /* add a layer based on markerslayer array */   
});

这样,每个帖子都会在回调中接收数据,然后在添加新层之前立即删除任何现有层。

注意:这也意味着您不需要(必然 - 取决于您的代码的其余部分)需要在回调之外保留对标记数组的引用。

于 2012-10-17T14:59:14.960 回答
1

此处的代码不会按预期工作,因为 ajax 是异步的:

/*some more code here */
$.post (a.php file here, {some data}, function(data){
    /* markerslayer array is made here */      
});

/* make some divs based on markerslayer array */

应该改成这样:

/*some more code here */
$.post (a.php file here, {some data}, function(data){
    /* markerslayer array is made here */  
    /* make some divs based on markerslayer array */    
});

我不确定您的代码中还发生了什么,但这太大而无法作为评论发布。

我也会将 if 语句移到 $.post 内部,这样可以防止出现重复标记,因为即使 ajax 请求发生两次,每次成功都会删除前一次成功对 dom 所做的事情。

于 2012-10-17T14:48:42.187 回答