第一次发布在这里＆gt;＆gt; PLZ建议如果问题或格式化非正式
以下代码检索路由列表和相关坐标。该列表显示为可单击的表格。
$("#listAll").click(function() {
$.mobile.navigate("#page31");
if (routes.length == 0) {
mLoader('show');
$.getJSON("tbs.ashx" + "?callback=?" + "&method=getAllRoutes", {
format: "json"
}).always(
function(result) {
routes = result.routes;
var tbl = '<table width="100%" data-role="table" id="table-column-toggle" data-mode="columntoggle" class="table-stroke table-stripe"><thead><tr class="ui-bar-b"><th>No.</th><th>From</th><th>To</th></tr></thead>';
tbl += '<tbody>';
for (j = 0; j < routes.length; j++) {
var fr = inArray(stops, routes[j].fr);
var to = inArray(stops, routes[j].to);
tbl += '<tr onclick="ListSchedule1(' + routes[j].id + ');mapRoute33(' + routes[j].id + ',' + routes[j].fr + ',' + routes[j].to + ')" style="cursor: pointer;"><td>' + routes[j].name + '</td><td>' + fr.name + '</td><td>' + to.name + '</td></tr>';
}
tbl += '</tbody></table>';
$("#routes31").html(tbl);
mLoader('hide');
}
);
}
});
**函数mapRoute33传递变量routes [j] .id。
我现在正在尝试存储此值以传递给新的HTML页面。此值保持gettng重置。**
单击列表中的路径后，路径的地图将在新的HTML＃page31中绘制。
现在，在＃page31;点击“信息”按钮会显示第321页的表格，其中包含该路线的时间表。
为了检索数据，需要routes [j] .id的值，但是下面的js中的赋值是保持重置。
v_route_id = route_id; //where v_route_id has been declared as a global variable.
mapRoute33 = function(routeid, startid, stopid) {
//global variable assignment
v_route_id = routeid;
$("#map33").height($(window).height() - 40);
$("#map33").html();
$.mobile.navigate("#page33");
if (map33 == null) {
setTimeout(function() {
var myOptions = {
styles: [{
"featureType": "landscape",
"stylers": [{
"hue": "#FFBB00"
}, {
"saturation": 43.400000000000006
}, {
"lightness": 37.599999999999994
}, {
"gamma": 1
}]
}, {
"featureType": "road.highway",
"stylers": [{
"hue": "#FFC200"
}, {
"saturation": -61.8
}, {
"lightness": 45.599999999999994
}, {
"gamma": 1
}]
}, {
"featureType": "road.arterial",
"stylers": [{
"hue": "#FF0300"
}, {
"saturation": -100
}, {
"lightness": 51.19999999999999
}, {
"gamma": 1
}]
}, {
"featureType": "road.local",
"stylers": [{
"hue": "#FF0300"
}, {
"saturation": -100
}, {
"lightness": 52
}, {
"gamma": 1
}]
}, {
"featureType": "water",
"stylers": [{
"hue": "#0078FF"
}, {
"saturation": -13.200000000000003
}, {
"lightness": 2.4000000000000057
}, {
"gamma": 1
}]
}, {
"featureType": "poi",
"stylers": [{
"hue": "#00FF6A"
}, {
"saturation": -1.0989010989011234
}, {
"lightness": 11.200000000000017
}, {
"gamma": 1
}]
}],
zoom: 10,
center: new google.maps.LatLng(-20.2838936, 57.5284781),
mapTypeControl: false,
scaleControl: false,
streetViewControl: false,
rotateControl: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map33 = new google.maps.Map(document.getElementById("map33"), myOptions);
croute = inArray(routes, routeid);
polyArr33 = [];
var pts = [];
var bounds = new google.maps.LatLngBounds();
var vertices = croute.pts;
var verticesArray = vertices.split("|");
for (k = 0; k < verticesArray.length; k++) {
var ll = verticesArray[k].split(",");
var point = new google.maps.LatLng(ll[1], ll[0]);
pts.push(point);
bounds.extend(point);
}
var poly = new google.maps.Polyline({
path: pts,
strokeColor: "red",
strokeOpacity: 0.6,
strokeWeight: 5
});
polyArr33.push(poly);
poly.setMap(map33);
map33.fitBounds(bounds);
for (w = 0; w < croute.stops.length; w++) {
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 5,
strokeColor: 'red',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(croute.stops[w].lat, croute.stops[w].lng),
draggable: false,
icon: gr,
labelContent: croute.stops[w].name,
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'stp',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
}
var start = inArray(stops, startid);
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 5,
strokeColor: 'black',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(start.lat, start.lng),
draggable: false,
icon: gr,
labelContent: start.stop,
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'trm',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
var stop = inArray(stops, stopid);
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 5,
strokeColor: 'black',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(stop.lat, stop.lng),
draggable: false,
icon: gr,
labelContent: stop.stop,
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'trm',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(pos) {
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 2,
strokeColor: 'red',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude),
draggable: false,
icon: gr,
labelContent: "YOU",
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'stp',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
});
}
},
200);
} else {
setTimeout(function() {
for (var i = 0; i < polyArr33.length; i++) {
polyArr33[i].setMap(null);
}
polyArr33 = [];
croute = inArray(routes, routeid);
var pts = [];
var bounds = new google.maps.LatLngBounds();
var vertices = croute.pts;
var verticesArray = vertices.split("|");
for (k = 0; k < verticesArray.length; k++) {
var ll = verticesArray[k].split(",");
var point = new google.maps.LatLng(ll[1], ll[0]);
pts.push(point);
bounds.extend(point);
}
var poly = new google.maps.Polyline({
path: pts,
strokeColor: "red",
strokeOpacity: 0.6,
strokeWeight: 5
});
polyArr33.push(poly);
poly.setMap(map33);
map33.fitBounds(bounds);
for (w = 0; w < croute.stops.length; w++) {
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 5,
strokeColor: 'red',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(croute.stops[w].lat, croute.stops[w].lng),
draggable: false,
icon: gr,
labelContent: croute.stops[w].name,
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'stp',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
}
var start = inArray(stops, startid);
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 5,
strokeColor: 'black',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(start.lat, start.lng),
draggable: false,
icon: gr,
labelContent: start.stop,
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'trm',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
var stop = inArray(stops, stopid);
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 5,
strokeColor: 'black',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(stop.lat, stop.lng),
draggable: false,
icon: gr,
labelContent: stop.stop,
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'trm',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(pos) {
var gr = {
path: google.maps.SymbolPath.CIRCLE,
scale: 2,
strokeColor: 'red',
strokeWeight: 4
};
var fp = new MarkerWithLabel({
position: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude),
draggable: false,
icon: gr,
labelContent: "YOU",
labelAnchor: new google.maps.Point(-12, 18),
labelClass: 'stp',
labelStyle: {
opacity: 0.8
}
});
fp.setMap(map33);
polyArr33.push(fp);
});
}
},
200);
}
};
Plz帮助将此值传递给新的HTML页面＃page321。
答案 0 :(得分：0)
为什么不为路由ID创建数组并保存该数组中的所有路由ID。这样它就不会被重置，你可以很容易地将它传递给另一个页面。