使用ajax/jquery查找地址使用郵政編碼？

Question

我發現這個非常了不起的腳本，它將使用郵政編碼查找地址。它適用於JsFiddle，但當我嘗試將其實現到我的網站上的頁面時，它不會執行任何操作。

http://jsfiddle.net/rxFBj/3/

我的代碼：

<form name="request"> 
    <p>Fill out the postcode and hit search</p> 

     <input name="address1" placeholder="address 1" /><br /> 
     <input name="custom_field" placeholder="address 2" /><br /> 
     <input name="address3" placeholder="address 3" /><br /> 
     <input name="address4" placeholder="address 4" /><br /> 
     <input class="postcode" name="postcode" placeholder="Postcode" /><br /> 
    </form> 







    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> 

<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>  
    <script> 
    /*fill out the postcode and hit search*/ 
    (function($) { 
     $.fn.searchPc = function(options) { 

      var settings = $.extend({ 
       address1: 'address1', 
       address2: 'address2', 
       address3: 'address3', 
       address4: 'address4' 
      }, options); 

      return this.each(function() { 

       var $el = $(this); 
       var $form = $el.closest('form'); 

       //insert the button on the form 
       $('<a class="postCodeLookup">Search</a>').insertAfter($el); 
       $('.postCodeLookup', $form).button({icons:{primary:'ui-icon-search'}}); 

       $form.on('click', '.postCodeLookup', function() { 

        $.post('http://maps.googleapis.com/maps/api/geocode/json?address='+$el.val()+'&sensor=false', function(r) { 
         var lat = r['results'][0]['geometry']['location']['lat']; 
         var lng = r['results'][0]['geometry']['location']['lng']; 
         $.post('http://maps.googleapis.com/maps/api/geocode/json?latlng='+lat+','+lng+'&sensor=false', function(address) { 
          $('input[name='+settings.address1+']').val(address['results'][0]['address_components'][0]['long_name']); 
          $('input[name='+settings.address2+']').val(address['results'][0]['address_components'][1]['long_name']); 
          $('input[name='+settings.address3+']').val(address['results'][0]['address_components'][2]['long_name']); 
          $('input[name='+settings.address4+']').val(address['results'][0]['address_components'][3]['long_name']); 
         }); 
        }); 

       }); 



      }); 
     }; 
    })(jQuery); 


      $('input[name=postcode]').searchPc({ 
       address2: 'custom_field', 
      }); 

    </script> 

請能有人告訴我，如果我做錯了什麼？謝謝

Answer 1

看你的JavaScript控制檯。注意它抱怨$未定義。

你已經加載jQuery-UI（兩次！）但不是jQuery，你的所有代碼都依賴於jQuery。