Question

我有一项任务，我需要通过ajax，* .KML文件调用并解析它以将点放在开放层图上。到目前为止，这是我设法做的，没有错误，它只是按钮点击刷新页面。你能指导一下我做错了吗？

＆＃13;

 $('#get-myData').click(function() {

   $.ajax({
     url: 'C:\..\kmlFile\2015-05-11_141102_imt2015.kml',
     dataType: 'html',
     success: function(data) {
       console.log(data);
       var Google = new google.maps.LatLng(37.42228990140251, -122.0822035425683);
       var mapOptions = {
         zoom: 18,
         center: Google
       }

       var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
       var geoXml = new geoXML3.parser({
         map: map
       });

       geoXml.parseKmlString(date);

       ctaLayer.setMap(map);
       console.log(data);

     }
   });
 }); < /script>

＆＃13;

<body>
<form runat="server">
  <input id="get-myData" type="submit" value="Click Me" />
</form>

</body>

＆＃13;

您可能已经注意到我正在从本地文件夹中获取文件。

Answer 1

只需点击按钮即可刷新页面。

您可以使用preventDefault()停止页面刷新。

 $('#get-myData').click(function(ev) {//ev is the event
   ev.preventDefault();//Prevent default action
   .....

修改

您还可以通过将button从type=submit更改为button类型来阻止刷新。

<input id="get-myData" type="button" value="Click Me" /> ^^^^^^^^^^^^

另一个解决方案是return false喜欢

$('#get-myData').click(function() { $.ajax({ url: 'C:\..\kmlFile\2015-05-11_141102_imt2015.kml', dataType: 'html', success: function(data) { console.log(data); var Google = new google.maps.LatLng(37.42228990140251, -122.0822035425683); var mapOptions = { zoom: 18, center: Google } var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); var geoXml = new geoXML3.parser({ map: map }); geoXml.parseKmlString(date); ctaLayer.setMap(map); console.log(data); } }); return false; //HERE });

但是，我认为preventDefault优于return false，因为它更能说明您的意图。

在按钮上单击调用js文件并解析它

1 个答案: