将JavaScript数组传递到另一个页面 [英] Pass javascript array to another page
问题描述
我正在使用一个数组来存储正在使用的坐标在Google地图上绘制多段线。数组在一页上工作正常，但是当我尝试调用数组在另一个地图上绘制多段线点时，它显示数组已被清空，并且没有绘制折线点。
我试图将localStorage与JSON stringify一起使用，但遇到了许多问题，其中Google地图不会接受值ether，因为它们包含不期望的值，或者因为它无法识别格式。
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）;
}
该代码从给定的坐标构建数组，该函数从内部调用watchPosition函数的onSuccess通过
storeLatLng（lat，lon）;
然后我想在下面的函数中使用数组值
函数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（经度，纬度）;
var mapOptions = {
zoom：17，
center：coords，
mapTypeControl：true，
mapTypeId：google.maps.MapTypeId.ROADMAP
};
//创建地图，并将其放置在HTML地图中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）;
这是另一页的onLoad调用
使用会话存储或本地存储传递数据:(基本示例） b $ b
您可以使用会话存储将数据从一个页面传递到下一个页面。或者，您也可以使用行为相似的本地存储。
对于本地存储，只需将 sessionStorage 替换为 localStorage 。
要存储的数组：
var testArray = ['test'];
存储阵列：
$ b $（$'pre> $（'＃store'）。on（'click'，function（）{
sessionStorage.setItem（'myArray'，testArray）;
}）;
取得数组： 清除会话存储： HTML： 支持Internet Explorer的旧版本： 某些资源： I was wondering if theres a way to pass an array and its contents to another page for use. I am using an array to store coordinates that are being used to draw a polyline onto a google map. The array works fine on one page, however when i attempt to call the array to draw the polyline points on another map, it appears the array has been emptied and no polyline points are drawn. I have attempted to use localStorage with JSON stringify but came across many many issues where google maps wont accept the values ether because they contain values its not expecting, or because it simply cant recognise the format. This code builds the array from the given coordinates, the function is called from within onSuccess of the watchPosition function through I then want to use the array values within the following function which is called onLoad of another page Pass data using Session Storage or Local Storage: (basic example) You can pass data from one page to the next using sessions storage. Alternatively you can also use local storage which behaves in similar fashion. Except local storage will not be cleared when the session is closed. For local storage just replace Array to store: Storing the Array: Getting the Array: Clearing the Session Storage: HTML: Checking to see stored session in chrome: If storing stringified data, make sure to convert back to JSON: DEMO: Supporting older versions of Internet Explorer: Some Resources: 这篇关于将JavaScript数组传递到另一个页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
$ b $（$'pre> $（'＃get'）。on（'click'，function（）{
var myArray = sessionStorage.getItem（'myArray'）;
alert（myArray）;
}）;
$ （'click'，function（）{
sessionStorage.clear（）;
}）;
$ p $ $（'＃clear'）。
< a href =javascript：void（0）; id =store> Store Array< / a>
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);
}
storeLatLng(lat, lon);
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);
}
}
sessionStorage with 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();
});
<a href="javascript:void(0);" id="store">Store Array</a>
<a href="javascript:void(0);" id="get">Get Array</a>
<a href="javascript:void(0);" id="clear">Clear</a>
var mydata = localStorage.getItem("GoogleLatLng");
var myObject = JSON.parse(mydata);
