2017-12-07 8 views
2

フォームフィールド名がChromeの自動入力が正しく機能しなくなる原因を知っている人はいますか? Chromeで作成したfiddleを開くと、[カード番号]フィールドに正しく入力されますが、有効期限は月と年ではありません。 BirthDate.Marの選択リストの名前をBirthDate.Fooに変更し、BirthDate.YYYYをBirthDate.Barに変更すると、再実行すると、クレジットカードの自動入力は期待通りに機能します。今、明白な示唆は、単純にbday-autofillを無効にし、それらの値を "off"に変更するか、またはオートコンプリート属性を完全に削除することです。驚くべきことに、オートコンプリート属性を削除したり、これらのフィールドでbday値を「オフ」に変更すると、アドレスの自動入力が中断されます。Chromeクレジットカードのオートフィルフィールド名バグ/競合

自動入力問題自体の解決策は、フィールド名を変更するだけです。私が知りたいのはなぜですか?誰でも私が無意識のうちにChromeのフィールド名スニッフィング機能をどのように突き刺したかを明確にすることはできますか?

<fieldset> 
    <legend>Payment Information</legend> 
    <div><input autocomplete="cc-number" id="CreditCard_CardNumber" maxlength="16" name="CreditCard.CardNumber" pattern="\d*" required="" type="text" placeholder="Card Number" value="" /></div> 
    <div> 
     <label for="CreditCard_ExpirationMonth">Expires:</label> 
     <select autocomplete="cc-exp-month" id="cardExpirationMonth" name="CreditCard.ExpirationMonth" required=""> 
      <option value="">Month</option> 
      <option value="1">January</option> 
      <option value="2">February</option> 
      <option value="3">March</option> 
      <option value="4">April</option> 
      <option value="5">May</option> 
      <option value="6">June</option> 
      <option value="7">July</option> 
      <option value="8">August</option> 
      <option value="9">September</option> 
      <option value="10">October</option> 
      <option value="11">November</option> 
      <option value="12">December</option> 
     </select> 
     <select autocomplete="cc-exp-year" id="cardExpirationYear" name="CreditCard.ExpirationYear" required=""> 
      <option value="">Year</option> 
      <option value="2017">2017</option> 
      <option value="2018">2018</option> 
      <option value="2019">2019</option> 
      <option value="2020">2020</option> 
      <option value="2021">2021</option> 
      <option value="2022">2022</option> 
      <option value="2023">2023</option> 
      <option value="2024">2024</option> 
      <option value="2025">2025</option> 
      <option value="2026">2026</option> 
      <option value="2027">2027</option> 
      <option value="2028">2028</option> 
      <option value="2029">2029</option> 
      <option value="2030">2030</option> 
      <option value="2031">2031</option> 
      <option value="2032">2032</option> 
      <option value="2033">2033</option> 
      <option value="2034">2034</option> 
      <option value="2035">2035</option> 
      <option value="2036">2036</option> 
      <option value="2037">2037</option> 
     </select> 
    </div> 
</fieldset> 
+0

可能な回答:https://stackoverflow.com/a/41965260、https://developers.google.com/web/fundamentals/design-and-ux/input/forms/#recommended_input_name_and_autocomplete_attribute_values – smdrager

答えて

0

名前の小文字のバージョンを使用してください。

名前属性としてNameを使用していない場合、自動入力はフィールドをCCとして認識します。

名前に変更すると、魅力的に機能します。

希望すると便利です。