html5自动对焦无法使用google maps v3 infowindow表单

时间:2014-01-13 21:01:54

标签: javascript html5 google-maps google-maps-api-3

我有一个简单的Google Maps v3应用程序,它显示带有InfoWindow弹出窗口的标记,每个弹出窗口都有一个小窗体。当InfoWindow弹出时,我希望焦点立即在单个输入元素上,但到目前为止还没有运气。下面是我正在使用的代码示例...

var infowindow1 = new google.maps.InfoWindow;

var content = "<div id='infobox'>"+
           "Rodney F. Stanley<hr>803-555-5555<br>"+ 
           "1 mile north of allenville<br>"+
           "<form name='report' action='updateNotes.php' method='POST'>"+ 
           "<input type='hidden' name='warningID' value='13874794739749' />"+
           "<input type='hidden' name='spotterID' value='SC00023' />"+
           "<input type='hidden' name='name' value='Rodney F. Stanley' />"+
           "<input type='text' name='report' size='25' maxsize='150' placeholder='event and time of occurence' autofocus />"+
           "<input type='submit' value='submit' /><br>"+
           "</form>"+
           "</div>";


infowindow1.setContent(content);

google.maps.event.addListener(marker1, "click", function() { 
if(openwindow){
    eval(openwindow).close();
}
openwindow=infowindow1;
infowindow1.open(map,marker1); 
    });

最终解决方案(只是听众)......

google.maps.event.addListener(marker1, "click", function() { 
if(openwindow){
    eval(openwindow).close();
}
openwindow=infowindow1;
infowindow1.open(map,marker1); 

    google.maps.event.addListener(infowindow1, 'domready', function() {
            $("#report").focus();
    });

});

1 个答案:

答案 0 :(得分:1)

您需要使用infowindow的domready事件并手动设置焦点。

google.maps.event.addListener(infowindow, 'domready', function () {

    // Set focus on your input here. Below in jQuery.
    $("#yourInput").focus();
});

这会奏效。自动对焦在这里不起作用。