Javascript字符串意外变成对象

Question

我一直在从事一个涉及Google Maps API的简单项目。 我的朋友想要他的网站的访客地图，访客可以在其中放置代表其位置的标记。 这些标记还与名称，消息等数据相关联。单击标记时，这些数据应显示在信息窗口中。

到目前为止，所有功能都运行良好，但是我遇到了一个让我感到困惑的错误。

当用户放下新点时，将调用一个函数来生成特定于该对象的表单。

function setupForm(id){
    var content='<div class="gdform">'+
            '<form id='+id+'>'+
            '<ul>'+
            '<li><input type="text" id="userName" value="name" onfocus="value=\'\'"/></li>'+
            '<li><textarea rows ="15" cols="50" wrap="hard"></textarea></li>'+
            '</ul>'+
            '<input type="button" value="submit" onclick="markers.'+id+'.setData()"/>'+
            '<input type="button" value="cancel" onclick="setTimeout(function(){removeMark('+id+')}, 100)"/>'+
            '</form>'+
            '</div>';
return content;

}

id是地图上每个标记的唯一ID。 这些标记存储在哈希表中，并且可以使用此ID进行引用。

这里的问题来自取消按钮。 当按下时，它应该关闭InfoWindow，从地图上删除标记，并从哈希表中删除标记。 为此，它调用了removeMark函数，如下所示：

function removeMark(id){
   infoWindow.close()
   markers.id.mark.setMap(null);
   delete markers.id;

}

但是，在这里，我收到一个类型错误，告诉我它无法读取未定义的属性标记。

为了调试代码，我设置了一些断点，一个在setupForm函数中，另一个在removeMark中。 逐步执行代码时，我注意到在setupForm ，js控制台将id为字符串。 但是，在removeMark中时，js控制台会通知我id突然成为对象。

我还不能弄清楚为什么会这样。 这是所有代码：

http://jsfiddle.net/39vKm/

谢谢您的帮助！

Answer 1

好的...您的代码存在三个问题...

首先，您在取消按钮的onclick声明中缺少ID周围的单引号。 其次，您需要从removeMark函数返回false，并在按钮上的onclick事件中返回removeMark（不需要超时）

码：

function setupForm(id){
    var content='<div class="gdform">'+
                '<form id='+id+'>'+
                '<ul>'+
                '<li><input type="text" id="userName" value="Whats your name?" onfocus="value=\'\'"/></li>'+
                '<li><textarea rows ="15" cols="50" wrap="hard"></textarea></li>'+
                   '</ul>'+
                '<input type="button" value="submit" onclick="markers.'+id+'.setData()"/>'+
                '<input type="button" value="cancel" onclick="return removeMark(\''+id+'\')"/>'+
                '</form>'+
                '</div>';
    return content;

}

第三，删除标记时，您需要使用阵列上的括号来引用标记...

function removeMark(id){
    infoWindow.close()
    markers[id].mark.setMap(null);
    delete markers[id];
    return false;
}

更新的小提琴： http : //jsfiddle.net/gislikonrad/39vKm/5/