我正在使用google places api来填写地址数据，我可能最多可输入11个地址，问题是每个地址它自动为所有5个表单填充数据。我只想要它填写它所在的slideid的地址。我想这样做而不需要制作x函数的副本，但我仍然坚持如何去做。 这里有一些代码来展示我在做什么。首先，我调用init代码进行自动完成。当从0
计数时，whichSlide在全局中初始化为等于零function initAutoCompleteDynamic() {
//I could have used a loop here for simplicity sake I am just doing manaully for now.
//set property values here.. .
autocomplete1 = new google.maps.places.Autocomplete(
(document.getElementById('prop1address0')),
{ types: ['geocode'] });
autocomplete1.addListener('place_changed', fillinAddressDynamic);
autocomplete2 = new google.maps.places.Autocomplete(
(document.getElementById('prop1address1')),
{ types: ['geocode'] });
autocomplete2.addListener('place_changed', fillinAddressDynamic);
}
//here I call fillinAddressDynamic
function fillinAddressDynamic() {
alert("value of which slide is " + whichSlide);
var place = autocomplete1.getPlace();
var success = true;
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
var field = addressType;
var completeaddress = '';
if (componentFormProduction[addressType]) {
var val = place.address_components[i][componentFormProduction[addressType]];
document.getElementById(cR0[addressType]).value = val;
if (field == "street_number") {
var streetnum = document.getElementById("streetnumber0").value = val;
}
if (field == "route") {
if (streetnum) {
completeaddress1 = streetnum + ' ' + val;
}
else {
completeaddress1 = val;
}
document.getElementById('prop1address0').value = completeaddress1;
}
}
}
whichSlide++;
var place2 = autocomplete2.getPlace();
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
var field = addressType;
var completeaddress = '';
if (componentFormProduction[addressType]) {
var val = place.address_components[i][componentFormProduction[addressType]];
document.getElementById(cR1[addressType]).value = val;
if (field == "street_number") {
var streetnum = document.getElementById("streetnumber1").value = val;
}
if (field == "route") {
if (streetnum) {
completeaddress1 = streetnum + ' ' + val;
}
else {
completeaddress1 = val;
}
document.getElementById('prop1address1').value = completeaddress1;
}
}
}
whichSlide++;
}
因为这里要求的是通过以下功能重新创建的基本表格。
function GetPropertySlide(idx, slideID) {
var retval = "" +
"<div id = 'hidden" + slideID + "' class='item lx-width-690 lx-align-center OtherIncomeSlidePropertyAddresses'>" +
"<div id = 'slideNumber" + idx + "'class='item lx-width-690 lx-align-center'>" +
" <input name='Properties[" + idx + "].ID' id='propertyID" + idx + "' type='hidden' value='0'>" +
" <div class='lx-row lx-font-bold lx-font-size-26 lx-margin-top-30'>" +
" Tell us about property # " + (idx + 1) + " - Dynamic properties slide" + "?" +
" </div>" +
" <div class='lx-row'>" +
" <button type='button' style = 'button margin-left:10px;' class='btn-btn-success' onclick='InitiateDeleteProperty(" + idx + ");'>Delete Me!</button>" +
" <button type='button' style = 'button margin-left:10px;' class='btn-btn-danger' onclick='clearform();'>Clear Me!</button>" +
" <button type='button' style = 'button margin-left:10px;' class='btn-btn-danger margin left 10px' onclick='MarketValue();'>Pull Market Value</button>" +
" <button type='button' style = 'button margin-left:10px;' class='btn-btn-danger margin left 10px' onclick='initAutoCompleteDynamic()'>Pull Address</button>" +
" </div>" +
" <div id='divpropaddress" + idx + "' class='lx-width-100-pct lx-align-center lx-row'>" +
" <div class='lx-row lx-width-550'>" +
" <div class='lx-word-wrap lx-font-size-18 lx-margin-top-30'>" +
" Address" +
" </div>" +
" <div class='lx-width-100-pct lx-margin-top-8'>" +
" <input name='Properties[" + idx + "].Address' class='form-control lx-font-color-lightblack lx-height-42' id = 'prop1address" + idx + "' type='text' value='' autocomplete='off' />" +
" </div>" +
" </div> " +
" <div class='lx-row lx-margin-top-15'>" +
" <input id= 'streetnumber" + idx + "'type='text'>' " +
" </div>" +
" <div class='lx-row lx-margin-top-15'> " +
" <div class='lx-float-left lx-margin-right-15'> " +
" <div class='lx-font-size-18'> " +
" City" +
" </div> " +
" <div class='lx-width-250 lx-margin-top-8'>" +
" <input name='Properties[" + idx + "].City' class='form-control lx-font-color-lightblack lx-height-42' id = 'prop1city" + idx + "' type='text' value='' autocomplete='off' />" +
" </div>" +
" </div> " +
" <div class='lx-float-left lx-margin-right-15'> " +
" <div class='lx-font-size-18'> " +
" State" +
" </div> " +
" <div class='lx-width-150 lx-margin-top-8'> " +
" <input name='Properties[" + idx + "].State' class = 'form-control lx-font-color-lightblack lx-height-42' id = 'prop1state" + idx + "' type='text' value='' autocomplete = 'off' />" +
" </div> " +
" </div> " +
" <div class='lx-float-left'> " +
" <div class='lx-font-size-18'> " +
" Zip Code" +
" </div> " +
" <div class='lx-width-120 lx-margin-top-8'> " +
" <input name='Properties[" + idx + "].ZipCode' class = 'form-control lx-font-color-lightblack lx-height-42' id = 'prop1zipcode" + idx + "' autocomplete = 'off' />" +
" </div> " +
" </div> " +
" </div> " +
" </div> " +
" <div class='lx-font-size-18 lx-margin-top-15'> What type of Property do you Own?</div> " +
" <div class='lx-float-left'> " +
" <div class='lx-width-550 lx-margin-top-15'> " +
" <select class='lx-form-properties-control lx-color-1 lx-height-42 ' + data-val='true' + data-val-number='The field PropertyTypeID must be a number.' + data-val-required='The PropertyTypeID field is required.' id = 'propertytypeid" + idx + "' name='Properties[" + idx + "].PropertyTypeID'><option value='- 1'>Property Type</option>' " +
" <option value= '0' > Single Family</option >" +
" <option value='1'>Condos/Co-op</option>" +
" <option value='2'>Townhouse</option>" +
" <option value='3'>Multi Family</option>" +
" <option value='4'>Manufactured</option>" +
" </select >" +
" </div> " +
" </div> " +
" <div class='lx-margin-top-60 lx-row '> " +
" <div class='lx-square-42 lx-float-left lx-margin-top-30'> " +
" <input name='Properties[" + idx + "].HasRental' class='form-control lx-font-color-lightblack' id='HasRental" + idx + "' type= 'checkbox' value= 'false' data-val-required='The HasRental field is required.' data-val='' /> " +
" </div> " +
" <div class='lx-float-left lx-font-size-18 lx-margin-left-10 lx-margin-top-36 lx-width-75-pct'> " +
" I am renting this property." +
" </div> " +
" </div> " +
" <div id= 'divmonthlyrentrow" + idx + "' class='lx-width-550 lx-margin-top-8 hidden'> " +
" <div class='lx-row'> " +
" <div class='lx-float-left lx-font-size-18 lx-margin-left-10 lx-margin-top-8'> " +
" What is the monthly rent you are collecting? " +
" </div> " +
" </div> " +
" <div class='lx-row '> " +
" <div class='input-icon'> " +
" <i> $</i> " +
" <input name='Properties[" + idx + "].monthlyrent' class = 'form-control lx-font-color-lightblack lx-height-42' id = 'monthlyrent" + idx + "' autocomplete = 'off' />" +
" </div> " +
" </div> " +
" </div> " +
" <div id = 'divtaxrow" + idx + "' class='lx-width-500 lx-margin-top-15 lx-row'> " +
" <div class='lx-square-42 lx-float-left'> " +
" <input name='Properties[" + idx + "].IsTaxIncluded' class = 'form-control lx-font-color-lightblack' id = 'IsTaxIncluded" + idx + "' type= 'checkbox' value= 'false' data-val=''/>" +
" </div> " +
" <div class='lx-float-left lx-font-size-18 lx-margin-left-10 lx-margin-top-10 lx-width-75-pct'> " +
" Tax included in payment ? " +
" </div> " +
" </div> " +
" <div id = 'divtaxamountrow" + idx + "' class='lx-width-550 lx-margin-top-15 hidden'> " +
" <div class='lx-row'> " +
" <div class='lx-word-wrap lx-font-size-18 '> " +
" Tax Amount" +
" <button type= 'button' style = 'button margin-left:10px;' class='btn-btn-primary margin left 5px ' onclick= 'PullAmount();' title='Pull Tax Amount'>Pull</button > " +
" </div> " +
" </div> " +
" <div class='lx-row'> " +
" <div class='input-icon'> " +
" <i> $</i> " +
" <input name='Properties[" + idx + "].TaxAmount' class = 'form-control lx-font-color-lightblack lx-height-42 lx-margin-top-15' id = 'taxamount" + idx + "' type='text' value='' data-val-required='The TaxAmount field is required.' data-val='true' data-val-number='The field TaxAmount must be a number.' autocomplete='off' />" +
" </div> " +
" </div> " +
" </div> " +
" <div id = 'divinsurancerow" + idx + "' class='lx-width-500 lx-margin-top-15 lx-row'> " +
" <div class='lx-square-42 lx-float-left'> " +
" <input name='Properties[" + idx + "].IsInsuranceIncluded' class = 'form-control lx-font-color-lightblack' id = 'IsInsuranceIncluded" + idx + "' type= 'checkbox' value= 'false' data-val=''/>" +
" </div> " +
" <div class='lx-float-left lx-font-size-18 lx-margin-left-10 lx-margin-top-10'> " +
" Insurance included in payment ? " +
" </div> " +
" </div> " +
" <div id = 'divfloodinsurancerow" + idx + "' class='lx-width-500 lx-margin-top-15 lx-row hidden'> " +
" <div class='lx-row'> " +
" <div class='lx-word-wrap lx-font-size-18'> " +
" Homeowner / Flood Insurance Amount" +
" </div> " +
" </div> " +
" <div class='lx-row'> " +
" <div class='input-icon'> " +
" <i> $</i> " +
" <input name=Properties[" + idx + "].InsuranceAmount' class='form-control lx-font-color-lightblack lx-height-42' id ='InsuranceAmount" + idx + "' type='text' value='' data-val-number='The field InsuranceAmount must be a number.' autocomplete='off' />" +
" </div> " +
" </div> " +
" </div> " +
" <div id = 'hoafee" + idx + "' class='lx-width-500 lx-margin-top-15 lx-row'>" +
" <div class='lx-square-42 lx-float-left'> " +
" <input name='Properties[" + idx + "].IsHOA' class = 'form-control lx-font-color-lightblack', id = 'IsHOA" + idx + "' type= 'checkbox' value= 'false' data-val=''/>" +
" </div> " +
" <div class='lx-float-left lx-font-size-18 lx-margin-left-10 lx-margin-top-10 '> " +
" Do you have a Homeowners Association? " +
" </div> " +
" </div> " +
" <div id = 'divassociationfeerow" + idx + "' class='lx-width-550 lx-margin-top-15 lx-row hidden'> " +
" <div class='lx-row'> " +
" <div class='lx-font-size-18 lx-margin-bottom-6'> " +
" Homeowner Association / Condo Fees" +
" </div> " +
" </div> " +
" <div class='lx-row'> " +
" <div class='input-icon'> " +
" <i> $</i> " +
" <input name='Properties[" + idx + "].CondoFees' class = 'form-control lx-font-color-lightblack lx-height-42', id = 'CondoFees" + idx + "'autocomplete ='off' />" +
" </div> " +
" </div> " +
" </div> " +
" <div class='lx-width-500 lx-margin-top-15 lx-row'> " +
" <div class='lx-square-42 lx-float-left'> " +
" <input name='Properties[" + idx + "].ClaimPropertyOnTaxReturn' class = 'form-control lx-font-color-lightblack', id = 'ClaimProperty" + idx + "' type= 'checkbox' value= 'false' data-val=''/>" +
" </div> " +
" <div class='lx-float-left lx-font-size-18 lx-margin-left-10 lx-margin-top-10'> " +
" Do you claim this property on tax return?" +
" </div> " +
" </div> " +
" <div id = 'divacquiredyearrow" + idx + "' class='lx-width-550 lx-margin-top-15 '> " +
" <div class='lx-row'> " +
" <div class='lx-font-size-18 lx-margin-top-1'> " +
" What year did you acquire this property? " +
" </div> " +
" </div> " +
" <div class='lx-row'> " +
" <div class='lx-width-550 lx-margin-top-8'> " +
" <input name='Properties[" + idx + "].AquiredYear' class = 'form-control lx-font-color-lightblack lx-height-42', id = 'AquiredYear" + idx + "', autocomplete = 'off' />" +
" </div> " +
" </div> " +
" </div> " +
" <div id = 'divassociationfeerow" + idx + "' class='lx-width-500 lx-margin-top-15'> " +
" <div class='lx-square-42 lx-float-left '> " +
" <input name='Properties[" + idx + "].FiledExtension' class = 'form-control lx-font-color-lightblack', id = 'FiledExtension" + idx + "' type= 'checkbox' value= 'false' data-val=''/>" +
" </div> " +
" <div class='lx-float-left lx-font-size-18 lx-margin-left-10 lx-margin-top-10'> " +
" Have you filed an extension for your tax returns? " +
" </div> " +
" </div> " +
"</div> ";
return retval;
}
答案 0 :(得分：0)
duh我可以将语句包装在if（then）中，这样就不会一次性触发每个语句 如果（whichSlide === 0）{ 措施1 ... else if（whichSlide === 1）{ 动作2 ..
差不多但我现在有另一个问题，事件处理程序反复触发，因为我为所有表单使用了相同的处理程序名称和函数 我不知道如何解决这个问题，因为它来自谷歌的例子。