我在表单中有名字、姓氏、电子邮件、城市、州、国家和邮政编码。
同样的 Angular 代码已经部署在生产、阶段、开发和本地环境。
我在同一个 Chrome 浏览器中访问所有这些 URL。自动填充在本地和生产环境中工作得很好,但是在 Dev 和 Stage 中只会填充名字和姓氏,必须手动选择电子邮件以便填写其余信息。
而且,它的工作方式很奇怪。
在 Stage 中,只有选择名字时才填充名字,在选择姓氏时填充除名字以外的所有字段。
在 Dev 中,选择名字后会填充名字和姓氏,在选择电子邮件后会填充除名字和姓氏以外的所有字段。
需要检查一下是否有问题吗?
检查元素的 HTML 代码...
同样的 Angular 代码已经部署在生产、阶段、开发和本地环境。
我在同一个 Chrome 浏览器中访问所有这些 URL。自动填充在本地和生产环境中工作得很好,但是在 Dev 和 Stage 中只会填充名字和姓氏,必须手动选择电子邮件以便填写其余信息。
而且,它的工作方式很奇怪。
在 Stage 中,只有选择名字时才填充名字,在选择姓氏时填充除名字以外的所有字段。
在 Dev 中,选择名字后会填充名字和姓氏,在选择电子邮件后会填充除名字和姓氏以外的所有字段。
需要检查一下是否有问题吗?
检查元素的 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>
Thanks
autofill
属性,并使用条目的键(autofill="lastName"
(我想是这样))。 - Adrian