Question

我正在使用此代码使用google maps api v3向Google地图添加标记，并打开用户可以填充的对话框。

$('#map_canvas').gmap().bind('init', function(event, map) {
    $(map).click(function(event) {
        $('#map_canvas').gmap('addMarker', {
            'position': event.latLng,
            'draggable': true,
            'bounds': false
        }, function(map, marker) {
            $('#dialog').append('<form id="dialog' + marker.__gm_id + '" name="dialog" method="get" action="/" style="display:none;"><p><label for="country">Country</label><input id="country' + marker.__gm_id + '" class="txt" name="country" value=""/></p><p><label for="state">State</label><input id="state' + marker.__gm_id + '" class="txt" name="state" value=""/></p><p><label for="address">Address</label><input id="address' + marker.__gm_id + '" class="txt" name="address" value=""/></p><p><label for="comment">Comment</label><textarea id="comment' + marker.__gm_id + '" class="txt" name="comment" cols="40" rows="5"></textarea></p></form>');
            findLocation(marker.getPosition(), marker);
        }).dragend(function(event) {
            findLocation(event.latLng, this);
        }).click(function() {
            openDialog(this);
        });
    });
});

每个对话框表格都应该是唯一的＆＃39; + marker.gm__id +＆＃39;应该是一个唯一的标识符。

但是＆＃39; + marker.gm__id +＆＃39;返回＆＃34; undefined＆＃34;，所以每个表单id都是＆＃34; dialogundefined＆＃34;。

我试图定义

var i = 0;

并将追加行更改为

$('#dialog').append('<form id="dialog'+i+'" name="dialog" method="get" action="/" style="display:none;"><p><label for="country">Country</label><input id="country'+i+'" class="txt" name="country" value=""/></p><p><label for="state">State</label><input id="state'+i+'" class="txt" name="state" value=""/></p><p><label for="address">Address</label><input id="address'+i+'" class="txt" name="address" value=""/></p><p><label for="comment">Comment</label><textarea id="comment'+i+'" class="txt" name="comment" cols="40" rows="5"></textarea></p></form>');

这不起作用;该对话框不再显示。我的目标是拥有唯一的表单标识符f.e. ＆＃34; dialog1＆＃34;，＆＃34; dialog2＆＃34;等等。

请帮忙

Answer 1

您应该在函数范围之外声明var i = 0，并且每次添加一个新对话框时将其递增1：

var i = 0;
$('#map_canvas').gmap().bind('init', function(event, map) {
    $(map).click(function(event) {
        $('#map_canvas').gmap('addMarker', {
            'position': event.latLng,
            'draggable': true,
            'bounds': false
        }, function(map, marker) {
            $('#dialog').append('<form id="dialog' + i + '" name="dialog" method="get" action="/" style="display:none;"><p><label for="country">Country</label><input id="country' + i + '" class="txt" name="country" value=""/></p><p><label for="state">State</label><input id="state' + i + '" class="txt" name="state" value=""/></p><p><label for="address">Address</label><input id="address' + i + '" class="txt" name="address" value=""/></p><p><label for="comment">Comment</label><textarea id="comment' + i + '" class="txt" name="comment" cols="40" rows="5"></textarea></p></form>');
            findLocation(marker.getPosition(), marker);
            i++;
        }).dragend(function(event) {
            findLocation(event.latLng, this);
        }).click(function() {
            openDialog(this);
        });
    });
});

在jquery append标记内设置js变量

1 个答案: