jQuery Google地圖根據點擊獲取地址

Question

我正在構建Google地圖功能。當用戶點擊按鈕時，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> 

Answer 1

看起來你不想加載地圖，直到點擊按鈕。但是，只要頁面準備就緒，您就要加載地圖。你是路過undefined作爲地址：

address: getAddress() 

功能getAddress()沒有返回值，所以當你將它的值的屬性，該屬性具有的undefined值。所有getAddress()都會爲您的按鈕分配點擊處理程序。在click處理程序中，讀取文本框的值，但該值將被忽略。

如果要在點擊按鈕後加載地圖，則需要移動代碼以在點擊處理程序中加載地圖。另外，移動getAddress()函數之外的點擊處理程序綁定。

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

工作演示：jsfiddle.net/wFxDR