从 javascript 数组创建一个 Jquery 数组

Make a Jquery array from a javascript array

本文关键字:数组 一个 Jquery javascript 创建      更新时间:2023-09-26

我使用以下代码从谷歌地图距离矩阵中提取一些里程数据。问题是它以普通的javascript的形式返回。我已经设法让它将数据放入 javascript 数组中,所以我有:

arrResults[0]
arrResults[1]
arrResults[2]
arrResults[3]

但是我现在想在 Jquery 中使用数组,但无法弄清楚如何将其转换为 Jquery 数组?

    $( document ).ready(function() {
        $( "#submit" ).click(function() {
        $("#my_map").gmap3({
      getdistance:{
        options:{ 
          origins:["pe219px","ng323rj"], 
          destinations:["pe219px","ng323rj"],
          travelMode: google.maps.TravelMode.DRIVING,
          unitSystem: google.maps.UnitSystem.IMPERIAL
        },
        callback: function(results, status){
          var html = "";
          var arrResults = [];
          if (results){
            for (var i = 0; i < results.rows.length; i++){
              var elements = results.rows[i].elements;
              for(var j=0; j<elements.length; j++){
                switch(elements[j].status){
                  case "OK":
                  var sd=$(this).text();  
                    html += parseInt(elements[j].distance.text) + "<br />";
        arrResults.push(elements[j].distance.text); 
                    break;
                  case "NOT_FOUND":
                    html += "The origin and/or destination of this pairing could not be geocoded<br />";
                    break;
                  case "ZERO_RESULTS":
                    html += "No route could be found between the origin and destination.<br />";
                    break;
                }
              }
            } 
          } else {
            html = "error";
          }
          $("#my_map").html( html );
        }
      }
    });
         }); });
    </head>
    <body>
    <div id="my_map"></div>
    <p><a id="submit" href="#">Submit</a></p>

它的问题稍微大一些,因为您使用的是gmap3插件,但这是我解决问题的方法。

第一:已编辑(有关更多详细信息,请参阅编辑(

其次,通过在 IIFE 的顶部声明arrResults,使其全局可用于您的函数。不要在其他任何地方重新声明它。

第三,将 ajax 函数的回调逻辑分离到一个新函数中。它使代码更易于阅读。像processData().

第三,一旦 AJAX 完成并且您的processData函数已经完成了它的运行,使用jQuery向页面添加新的#viewresults按钮。

$('body').append('<input id="viewresults" type="submit" value="View results"/>')

你这样做是因为 AJAX asyncronous .在收集数据之前单击viewresults按钮将导致错误或什么都不会导致,因此(至少对于您的代码而言(仅在数据可用时才使用该按钮是有意义的。

我在这个jsfiddle中提供了这些想法的摘要(未经测试,但应该给你一些线索(。我希望你觉得它有用。