Chrome浏览器自动填充功能无法正常工作
我的名字中有姓氏，电子邮件，城市，州，国家和邮政编码。
在Prod，Stage，Dev＆Local中部署了相同的角码。
我在同一台Chrome浏览器中访问所有这些网址。 自动填充在Local＆Prod中完美运行。 但是，它只填写Dev和Stage中的First和Last名称，并且必须选择电子邮件才能填写剩余的内容。
也奇怪地工作。
在阶段中，从自动填充选择名字时，只填写第一个名字并从自动填充中选择姓氏所有字段（firstName除外）都被填充。
在Dev中，从自动填充选择名字时，名字和姓氏将被填充，并且从自动填充中选择电子邮件将填充所有字段（firstName和Last name除外）。
有什么要检查的吗？
检查元素的HTML代码...
<form id="signup-form" novalidate="" name="myinfoForm" class="ng-pristine ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength ng-valid-email" style="">
<div id="form-template-myinfo">
<div class="panel">
<div class="panel-body">
<div ng-include="" src="'/app/components/personal/info.html'" class="" style=""><div id="myinfo" on-rendered="info1Variation">
<div class="info_container">
<div class="well well-lg invisible-box col-sm-12 col-md-8 col-lg-8" ng-class="singlePageApp.isEnabled?'col-md-12 col-lg-12':'col-md-8 col-lg-8'">
<text-input ng-if="!multifieldEnabled" input-field-classes="text-ellipsis" class="input-field" type="text" name="firstName" belongs-to="" min-length="2" max-length="40" placeholder="First Name" validation="regExpression.name" model="firstName" require="true" focus="true" input-id="firstName" messages="errorMessages.firstNameRedesign" field="First Name (Primary)" sub-directive="valid-name-chars"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_firstName">
<li>
<label for="field_firstName" ng-class="fieldLabel" class="hide-label" style="">First Name</label>
<input type="text" placeholder="First Name" name="firstName" id="field_firstName" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" valid-name-chars="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" minlength="2" maxlength="40" ng-required="true" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength text-ellipsis ng-touched is-invalid" required="required" style="">
<span ng-if="fieldClass == 'is-valid' || fieldClass == 'is-invalid' || fieldClass == 'is-invalid-touched'" class="text-input-validation" style="">
<img ng-if="fieldClass == 'is-invalid' || fieldClass == 'is-invalid-touched'" src="/images/is-invalid.png"> </span>
</li>
<div ng-if="fieldClass == 'is-invalid' || fieldClass == 'is-invalid-touched'" ng-messages="myForm[name].$error" class="ng-active" style="">
<div ng-repeat="errorMessage in messages">
<div class="ll_error" field="First Name (Primary)" ng-message-exp="errorMessage.type"></div>
</div><div ng-repeat="errorMessage in messages">
</div><div ng-repeat="errorMessage in messages">
</div>
</div>
</div>
</div>
</div>
</div>
</text-input>
<text-input ng-if="!multifieldEnabled" input-field-classes="text-ellipsis" class="input-field" type="text" belongs-to="" name="lastName" min-length="2" max-length="40" placeholder="Last Name" validation="regExpression.name" model="lastName" require="true" messages="errorMessages.lastNameRedesign" field="Last Name (Primary)" sub-directive="valid-name-chars"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_lastName">
<li>
<label for="field_lastName" ng-class="fieldLabel" class="hide-label" style="">Last Name</label>
<input type="text" placeholder="Last Name" name="lastName" id="field_lastName" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" valid-name-chars="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" minlength="2" maxlength="40" ng-required="true" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength is-empty text-ellipsis" required="required" style="">
</li>
</div>
</div>
</div>
</text-input>
<text-input ng-if="formFieldCtrl.yi1.showFieldEmail" input-field-classes="text-ellipsis" class="input-field" belongs-to="" type="email" name="emailAddress" placeholder="Email Address" sub-directive="email-field-validation::no-spaces" input-id="inputEmail" validation="regExpression.email" model="emailAddress" require="true" start-validation-func="startEmailValidation()" end-validation-func="endEmailValidation()" messages="errorMessages.emailErrorMessagesRedesign" field="E-mail (Primary)"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_emailAddress">
<li>
<label for="field_emailAddress" ng-class="fieldLabel" class="hide-label" style="">Email Address</label>
<input type="email" placeholder="Email Address" name="emailAddress" id="field_emailAddress" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" email-field-validation="" no-spaces="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" minlength="" maxlength="" ng-required="true" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength is-empty text-ellipsis ng-valid-email" required="required" style="">
</li>
</div>
</div>
</div>
</text-input>
<div ng-if="formFieldCtrl.yi1.showFieldAddress && !singlePageApp.isEnabled">
<text-input ng-if="!isAutoAddressYourInfo" input-field-classes="text-ellipsis" class="input-field" type="text" belongs-to="" name="street1" placeholder="Address 1" validation="regExpression.address" model="street1" min-length="2" require="true" messages="errorMessages.street1Redesign" parent-model="primaryMember" field="Street 1 (Primary)"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_street1">
<li>
<label for="field_street1" ng-class="fieldLabel" class="hide-label" style="">Address 1</label>
<input type="text" placeholder="Address 1" name="street1" id="field_street1" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" nested-directive="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" ng-required="true" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength is-empty text-ellipsis" required="required" style="">
</li>
<!-- ngIf: fieldClass == 'is-invalid' || fieldClass == 'is-invalid-touched' -->
</div>
</div>
</div>
</text-input>
<text-input input-field-classes="text-ellipsis" class="input-field" type="text" belongs-to="" name="street2" placeholder="Apt, Suite, Bldg - Optional" validation="regExpression.address2" model="street2" messages="errorMessages.street2Redesign" field="Street 2 (Optional)"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_street2">
<li>
<label for="field_street2" ng-class="fieldLabel" class="hide-label" style="">Apt, Suite, Bldg - Optional</label>
<input type="text" placeholder="Apt, Suite, Bldg - Optional" name="street2" id="field_street2" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" nested-directive="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" ng-required="" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-untouched ng-valid ng-empty ng-valid-pattern ng-valid-minlength ng-valid-maxlength is-empty text-ellipsis ng-valid-required" style="">
</li>
</div>
</div>
</div>
</text-input>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<text-input class="input-field" input-field-classes="text-ellipsis" type="text" belongs-to="" name="city" placeholder="City" min-length="2" max-length="25" validation="regExpression.city" model="city" require="true" messages="errorMessages.cityRedesign" sub-directive="only-letters" field="City (Primary)"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_city">
<li>
<label for="field_city" ng-class="fieldLabel" class="hide-label" style="">City</label>
<input type="text" placeholder="City" name="city" id="field_city" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" only-letters="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" ng-required="true" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength is-empty text-ellipsis" required="required" style="">
</li>
</div>
</div>
</div>
</text-input>
</div>
<div id="state-col" class="col-xs-6 col-sm-6 col-md-3 col-lg-3 strip-left-pad">
<text-input class="input-field" type="text" belongs-to="" name="states" placeholder="State" max-length="2" validation="regExpression.states" sub-directive="to-uppercase::only-letters" model="stateCode" require="true" messages="errorMessages.stateRedesign" field="State (Primary)"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_states">
<li>
<label for="field_states" ng-class="fieldLabel" class="hide-label" style="">State</label>
<input type="text" placeholder="State" name="states" id="field_states" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" to-uppercase="" only-letters="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" ng-required="true" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-untouched ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength is-empty" required="required" style="">
</li>
</div>
</div>
</div>
</text-input>
</div>
<div id="zip-col" class="col-xs-6 col-sm-6 col-md-3 col-lg-3 strip-left-pad">
<text-input class="input-field" type="tel" name="postalCode" belongs-to="" placeholder="Zip Code" min-length="5" max-length="5" validation="regExpression.zip" model="postalCode" require="true" messages="errorMessages.postalCodeRedesign" sub-directive="only-number" field="Postal Code (Primary)"><div class="field-container strip-sides-paddings" ng-class="fieldWidth">
<div class="text-input">
<div class="wrapper" id="wrapper_postalCode">
<li>
<label for="field_postalCode" ng-class="fieldLabel" class="hide-label" style="">Zip Code</label>
<input type="tel" placeholder="Zip Code" name="postalCode" id="field_postalCode" ng-model="model" ng-focus=“onFocus()" ng-blur=“onBlur()" only-number="" ng-class="[fieldClass, fieldWidth, inputFieldClasses]" ng-required="true" ng-trim="false" ng-disabled="disable" class="ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required ng-valid-pattern ng-valid-minlength ng-valid-maxlength is-empty" required="required" style="">
</li>
</div>
</div>
</div>
</text-input>
</div>
</div>
</div>
</div>
</div>
</div></div>
</div>
</div>
<div class="panel-footer">
<div class="row">
<button type="submit" ng-click="saveDetails()” role="button">Save
</button>
</div>
</div>
</div>
</form>
谢谢
请在您的输入标签中添加以下属性
autocomplete="name"
autocomplete="email"
autocomplete="tel"
等 ....在你的HTML代码。
请参阅此文档以获取更多详细信息：
https://developers.google.com/web/updates/2015/06/checkout-faster-with-autofill
本文档将帮助您解决问题。
链接地址: http://www.djcxy.com/p/26505.html