Question

我真的坚持我正在做的这个项目。以下是我的代码。我顺便使用Google Maps API。

var arr = new Array();
arr[0] = lat1, lon1
arr[1] = lat2, lon2
arr[2] = lat3, lon3
for (each i in arr){
    var newCenter = "<button onClick='map.setCenter(arr[i])'>Center Map</button>";
    $("#myTable").append(newCenter);
}

现在我知道了

'map.setCenter(arr[i])'

是不正确的，因为它基本上是将“arr [i]”硬编码到DOM中。我想要做的是使用arr [i]作为变量，以便DOM具有：

<button onClick='map.setCenter(arr[0])'>Center Map</button>
<button onClick='map.setCenter(arr[1])'>Center Map</button>
<button onClick='map.setCenter(arr[2])'>Center Map</button>

我试过了

"<button onClick='map.setCenter(" + arr[i] + ")'>Center Map</button>"

但这不起作用。我已经坚持了很长时间。任何帮助，将不胜感激。谢谢。

Answer 1

1-循环使用for (var i = 0 ; i < arr.length ;i++)和不 in运算符的数组。

2-您需要在单独的函数上创建链接以获取闭包（explanation here）

3-你的数组应该包含google.maps.LatLng()个对象。

var arr = new Array();
arr[0] = new google.maps.LatLng(lat1, lon1);
arr[1] = new google.maps.LatLng(lat2, lon2);
arr[2] = new google.maps.LatLng(lat3, lon3);


for (var i = 0 ; i < arr.length ;i++) {
    var button = createbutton(arr[i],i);
 }

function createbutton(latlon,index) {
    var button = document.createElement('button');
    var container = document.getElementById('containerDiv');
    button.onclick = function(){map.setCenter(latlon)};
    button.value = 'Center Map at ' + index;
    container.appendChild(button);
}

...并在您的HTML中：

<div id ="containerDiv"></div>

Answer 2

for (each i in arr){

应该是

for (var i in arr){

同样arr[0] = lat1, lon1首先没有任何意义

完整代码

for (var i in arr){
    var newCenter = "<button onClick='map.setCenter("+ arr[i] + ")'>Center Map</button>";
    $("#myTable").append(newCenter);
}

JQuery / HTML：如何在onClick中使用变量

2 个答案: