爲什麼沒有乳寧我的網頁上的代碼

-3

var autocomplete = {}; 
 
var autocompletesWraps = ['test', 'test2']; 
 

 
var test_form = { 
 
    street_number: 'short_name', 
 
    route: 'long_name', 
 
    locality: 'long_name', 
 
    administrative_area_level_1: 'short_name', 
 
    country: 'long_name', 
 
    postal_code: 'short_name' 
 
}; 
 
var test2_form = { 
 
    street_number: 'short_name', 
 
    route: 'long_name', 
 
    locality: 'long_name', 
 
    administrative_area_level_1: 'short_name', 
 
    country: 'long_name', 
 
    postal_code: 'short_name' 
 
}; 
 

 
function initialize() { 
 

 
    $.each(autocompletesWraps, function(index, name) { 
 

 
    if ($('#' + name).length == 0) { 
 
     return; 
 
    } 
 

 
    autocomplete[name] = new google.maps.places.Autocomplete($('#' + name + ' .autocomplete')[0], { 
 
     types: ['geocode'] 
 
    }); 
 

 
    google.maps.event.addListener(autocomplete[name], 'place_changed', function() { 
 

 
     var place = autocomplete[name].getPlace(); 
 
     var form = eval(name + '_form'); 
 

 
     for (var component in form) { 
 
     $('#' + name + ' .' + component).val(''); 
 
     $('#' + name + ' .' + component).attr('disabled', false); 
 
     } 
 

 
     for (var i = 0; i < place.address_components.length; i++) { 
 
     var addressType = place.address_components[i].types[0]; 
 
     if (typeof form[addressType] !== 'undefined') { 
 
      var val = place.address_components[i][form[addressType]]; 
 
      $('#' + name + ' .' + addressType).val(val); 
 
     } 
 
     } 
 
    }); 
 
    }); 
 
}

html, 
 
body, 
 
#map-canvas { 
 
    height: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
} 
 

 
#locationField, 
 
#controls { 
 
    position: relative; 
 
    width: 480px; 
 
} 
 

 
#autocomplete { 
 
    position: absolute; 
 
    top: 0px; 
 
    left: 0px; 
 
    width: 99%; 
 
} 
 

 
.label { 
 
    text-align: right; 
 
    font-weight: bold; 
 
    width: 100px; 
 
    color: #303030; 
 
} 
 

 
table { 
 
    border: 1px solid #000090; 
 
    background-color: #f0f0ff; 
 
    width: 480px; 
 
    padding-right: 2px; 
 
} 
 

 
table td { 
 
    font-size: 10pt; 
 
} 
 

 
.field { 
 
    width: 99%; 
 
} 
 

 
.slimField { 
 
    width: 80px; 
 
} 
 

 
.wideField { 
 
    width: 200px; 
 
} 
 

 
#locationField { 
 
    height: 20px; 
 
    margin-bottom: 2px; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Place Autocomplete Address Form</title> 
 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
 
    <meta charset="utf-8"> 
 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
    <link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"> 
 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script> 
 
</head> 
 

 
<body onload="initialize()"> 
 

 
    <div id="test"> 
 

 
    <input class="autocomplete" placeholder="Enter your address" type="text"></input> 
 

 
    <table> 
 
     <tr> 
 
     <td class="label">Street address</td> 
 
     <td class="slimField"><input class="field street_number" disabled="true"></input> 
 
     </td> 
 
     <td class="wideField" colspan="2"><input class="field route" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">City</td> 
 
     <td class="wideField" colspan="3"><input class="field locality" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">State</td> 
 
     <td class="slimField"><input class="field administrative_area_level_1" disabled="true"></input> 
 
     </td> 
 
     <td class="label">Zip code</td> 
 
     <td class="wideField"><input class="field postal_code" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">Country</td> 
 
     <td class="wideField" colspan="3"><input class="field country" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
    </table> 
 
    </div> 
 

 
    <br /><br /> 
 

 
    <div id="test2"> 
 

 
    <input class="autocomplete" placeholder="Enter your address" type="text"></input> 
 

 
    <table> 
 
     <tr> 
 
     <td class="label">Street address</td> 
 
     <td class="slimField"><input class="field street_number" disabled="true"></input> 
 
     </td> 
 
     <td class="wideField" colspan="2"><input class="field route" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">City</td> 
 
     <td class="wideField" colspan="3"><input class="field locality" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">State</td> 
 
     <td class="slimField"><input class="field administrative_area_level_1" disabled="true"></input> 
 
     </td> 
 
     <td class="label">Zip code</td> 
 
     <td class="wideField"><input class="field postal_code" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">Country</td> 
 
     <td class="wideField" colspan="3"><input class="field country" disabled="true"></input> 
 
     </td> 
 
     </tr> 
 
    </table> 
 
    </div> 
 

 
</body> 
 

 
</html>

我抄在同一網站上的代碼和本網站上的代碼運行，但是當我將此代碼複製並粘貼在我的其他網頁運行這但這不會運行。

其次我用我的這個API /地圖/ API/JS？V = MY API USING.exp &庫=將和我的谷歌API = AIzaSyCs2QvVo6pUXt6RDDc25Aqk9lhQIge9Px8 請告訴我能對這個代碼做

來源

2017-09-06 Rohit Kumar

在'console'任何錯誤？這可能是因爲1000個原因.. –

告訴我如何解決這個錯誤 –

你可以在'console'中看到錯誤是什麼？ –

我在這裏創建了一個DEMO。你可以看看。我已經對你的代碼做了一些修改，現在它正在工作！

JS代碼：

$(function() { 
var autocomplete = {}; 
     var autocompletesWraps = ['test', 'test2']; 

     var test_form = { street_number: 'short_name', route: 'long_name', locality: 'long_name', administrative_area_level_1: 'short_name', country: 'long_name', postal_code: 'short_name' }; 
     var test2_form = { street_number: 'short_name', route: 'long_name', locality: 'long_name', administrative_area_level_1: 'short_name', country: 'long_name', postal_code: 'short_name' }; 

     function initialize() { 

      $.each(autocompletesWraps, function(index, name) { 

       if($('#'+name).length == 0) { 
        return; 
       } 

       autocomplete[name] = new google.maps.places.Autocomplete($('#'+name+' .autocomplete')[0], { types: ['geocode'] }); 

       google.maps.event.addListener(autocomplete[name], 'place_changed', function() { 

        var place = autocomplete[name].getPlace(); 
        var form = eval(name+'_form'); 

        for (var component in form) { 
         $('#'+name+' .'+component).val(''); 
         $('#'+name+' .'+component).attr('disabled', false); 
        } 

        for (var i = 0; i < place.address_components.length; i++) { 
         var addressType = place.address_components[i].types[0]; 
         if (typeof form[addressType] !== 'undefined') { 
          var val = place.address_components[i][form[addressType]]; 
          $('#'+name+' .'+addressType).val(val); 
         } 
        } 
       }); 
      }); 
     } 

    initialize(); 
    });

來源

2017-09-06 05:24:42

看來他的代碼也工作。他只是說這些代碼在**他的**網站中不起作用。 –

我已經在我的回答中說過，「我對代碼做了一些修改」。他的代碼出現了一些問題，所以經過修改後，代碼現在正在工作。 –

這是代碼不工作我使用相同的代碼，當你提供給我但這是行不通的，我是替換你的API，但這是行不通的 –

爲什麼沒有乳寧我的網頁上的代碼

回答

相關問題