传递JavaScript数组到另一个页面

10 浏览
0 Comments

传递JavaScript数组到另一个页面

我想知道是否有一种方法可以将数组及其内容传递到另一个页面以供使用。\n我正在使用一个数组来存储用于绘制谷歌地图上折线的坐标。数组在一个页面上工作得很好，但是当我尝试调用数组以在另一个地图上绘制折线点时，似乎数组已经被清空，没有绘制任何折线点。\n我尝试使用localStorage和JSON stringify，但遇到了许多问题，谷歌地图无法接受这些值，因为它们包含了它不期望的值，或者因为它根本无法识别格式。\n这段代码根据给定的坐标构建数组，该函数从watchPosition函数的onSuccess中调用：\n

var googleLatLng = [],
    latlngs = [];
function storeLatLng( lat, lng ) {
    googleLatLng.push(new google.maps.LatLng(lat, lng));
    latlngs.push([lat, lng]);
        // setcoords = JSON.stringify(googleLatLng);
        // localStorage.setItem('GoogleLatLng', setcoords);
        // console.log(localStorage.getItem("GoogleLatLng"));
        console.log(googleLatLng);
}

\n然后，我希望在以下函数中使用数组值：\n

function finishedWalk() {
        // storedCoords = localStorage.getItem('GoogleLatLng');
        // if(storedCoords) storedCoords = JSON.parse(storedCoords);
        navigator.geolocation.getCurrentPosition(onFinishedSuccess, onFinishedError);
}
    function onFinishedSuccess(position) {
    var latitude = position.coords.latitude;
    var longitude = position.coords.longitude;
    coords = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
    storeLatLng(latitude, longitude);
        var mapOptions = {
            zoom: 17,
            center: coords,
            mapTypeControl: true,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        //create the map, and place it in the HTML map div
        map = new google.maps.Map(document.getElementById("mapPlaceholder"), mapOptions);
        if (googleLatLng.length > 0) {
          var path = new google.maps.Polyline({
            path: googleLatLng,
            strokeColor: "#FF0000",
            strokeOpacity: 1.0,
            strokeWeight: 5
          });
          path.setMap(map);
        }
}

\n这个函数是在另一个页面的onLoad中调用的。

0

2 答案

0 Comments

问题的出现原因：用户希望将JavaScript数组传递到另一个页面。

解决方法：用户可以通过以下几种方式解决这个问题：

1. 使用表单提交数据到另一个HTML页面。

2. 在下一个页面的onLoad事件中获取数据。

3. 使用会话存储来存储数据。

4. 使用框架（如Angular）构建单页面应用程序。

以下是一些解决该问题的相关链接：

1. 如何在不附加到URL中的情况下将数据发送到另一个页面？[链接](https://stackoverflow.com/questions/12777691)

2. 将表单数据传递给另一个HTML页面 [链接](https://stackoverflow.com/questions/14693758)

3. 使用JavaScript和PHP将数据传递给另一个页面的教程 [链接](http://www.boutell.com/newfaq/creating/scriptpass.html)

如果使用jQuery Mobile，也可以传递变量。以下是一个基本示例：

// 在第一个页面中设置变量
var myArray = [1, 2, 3];
// 使用jQuery Mobile传递变量到第二个页面
$.mobile.changePage("secondPage.html", {
  data: {
    myArray: myArray
  }
});
// 在第二个页面的onLoad事件中获取变量
$(document).on("pagecreate", "#secondPage", function() {
  var myArray = $.mobile.pageData.myArray;
  console.log(myArray); // 输出 [1, 2, 3]
});

请注意，由于应用程序使用PhoneGap构建，无法在数据传输中使用PHP文件。因此，需要使用其他方法来传递数据。

0
0 Comments

问题的出现原因：这篇文章介绍了如何将JavaScript数组传递到另一个页面。作者在使用jQuery Mobile重新构建应用程序时遇到了问题，并希望通过解决方法来解决。

解决方法：作者提供了使用会话存储或本地存储传递数据的方法。可以使用会话存储将数据从一个页面传递到另一个页面。另外，也可以使用本地存储，其行为类似，但在会话关闭时不会被清除。对于本地存储，只需将sessionStorage替换为localStorage。

首先，需要定义一个数组来存储数据：

var testArray = ['test'];

然后，可以使用以下代码将数组存储到会话存储中：

$('#store').on('click', function(){
    sessionStorage.setItem('myArray', testArray);
});

要获取存储的数组，可以使用以下代码：

$('#get').on('click', function(){
    var myArray = sessionStorage.getItem('myArray');
    alert(myArray);
});

如果需要清除会话存储中的数据，可以使用以下代码：

$('#clear').on('click', function(){
    sessionStorage.clear();
});

此外，如果存储的数据是字符串化的，需要将其转换回JSON格式：

var mydata = localStorage.getItem("GoogleLatLng");
var myObject = JSON.parse(mydata);

如果需要支持旧版本的Internet Explorer，可以使用一些资源库来实现：

最后，还有一些相关资源供读者参考：

作者重建了使用jQuery Mobile的应用程序，并希望通过尝试这些解决方法来解决问题。

0