为什么我不能用 jQuery 删除这些 div？

debugcn 发表于 Dev

阿什莉·布朗

我.output在我的on('click')函数中创建的父元素中动态创建了元素。

$(document).on("click", '#search', function() {   
//Loop crime data array from api request above...
for(var i = 0; i < mapData.length; i++) {

  //Fill in crime data
  var fill = '<div class="row resu"><div class="col-xs-2 number"><h5>'+[i+1]+'</h5></div><div class="col-xs-10"><p class="text-primary">Type of crime: <span class="text-strong">'+mapData[i][0]+'</span></p><p class="text-primary">Location specifics: <span class="text-strong">'+mapData[i][1]+'</span></p></div></div>';

  //add to div
  $('.output').append(fill);  
}
...
.......

但是在函数之外的任何地方我都无法定位.resu我可以申请的新行.empty()或.remove(). 每次我点击搜索按钮时，我都希望先清空输出容器 div。

如果你去我的笔前按下按钮，你会看到一些关于该邮政编码区域内犯罪的信息。如果你一直按下它，那么相同信息的多个重复将填满它。我怎样才能用jquery摆脱那些？

我的笔：https : //codepen.io/anon/pen/xrwXYy

经过

这是更新演示：https : //codepen.io/anon/pen/PjPJaZ

问题是，您mapData在每次请求后都将数据添加到数组。您还需要mapData在每次请求后重置数组。

function getPolApi(year,month,lat,lng,mapData) {
    $.ajax({
    url : "https://data.police.uk/api/crimes-at-location?date="+year+"-"+month+"&lat="+lat+"&lng="+lng,
    type : "get",
    async: false,
    success : function(data) {
     mapData = [];// Empty the array
      for(var i = 1; i < data.length; i++) {      
            mapData.push([
              data[i]['category'],
              data[i]['location']['street']['name'],
            ]);

           heatmapData.push(new google.maps.LatLng(data[i].location.latitude,data[i].location.longitude));
      }
       //Add results into view

          for(var i = 0; i < mapData.length; i++) {
             var fill = '<div class="row resu"><div class="col-xs-2 number"><h5>'+[i+1]+'</h5></div><div class="col-xs-10"><p class="text-primary">Type of crime: <span class="text-strong">'+mapData[i][0]+'</span></p><p class="text-primary">Location specifics: <span class="text-strong">'+mapData[i][1]+'</span></p></div></div>';
            $('.output').append(fill);

          }//endforloop

          //Move the map into view of the heatmaps
          moveMap(lat,lng);
          //Add the heatmaps
          addHeatMap();
      mapData = [];
      // console.log(mapData);
    },
    error: function(dat) {
       console.log('error');
    }

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。