0

我正在构建一个谷歌地图功能。当用户单击按钮时，jquery 脚本应该从文本框中获取地址，但它不能正常工作。有人知道我做错了什么吗？

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&amp;language=en"></script>
<script type="text/javascript" src="<?=base_url()?>data/gmap3.js"></script>

<script>
    $(document).ready(function() {
        function getAddress() {
            $("#addressClick").click(function() {
                $('#address').val();
            });
        }
        $("#my_map").gmap3({
            marker: {
                address: getAddress()
            }, map:{
                options:{
                    zoom: 14
                }
            }
        });
    });
</script>
<input id="address" type="text" placeholder="Please type in your address"><input type="button" value="Go to location" id="addressClick">
<div id="my_map" style=" height: 350px; width: 300px;"></div>
4

1 回答 1

1

在单击按钮之前，您似乎不想加载地图。但是，您将在页面准备好后立即加载地图。你undefined作为地址传递：

address: getAddress()

该函数getAddress()没有返回值，因此当您将其值分配给属性时，该属性的值为undefined. 所做的只是为您的按钮分配一个getAddress()点击处理程序。在点击处理程序中，文本框的值被读取，但该值被忽略。

如果要在单击按钮后加载地图，则需要移动代码以在单击处理程序中加载地图。此外，将该单击处理程序绑定移到函数之外getAddress()。

$(document).ready(function() {
    $("#addressClick").click(function() {
        $("#my_map").gmap3({
            marker: {
                address: $('#address').val()
            }, map:{
                options:{
                    zoom: 14
                }
            }
        });
    });
});

工作演示： jsfiddle.net/wFxDR

于 2012-11-16T17:39:58.853 回答