14

私たちのサイトを Chrome の Address Autofill と結びつけることを望んでいましたが、フォームがどのように表示されるかについての参照が見つかりません。

フォームの name= フィールドでかなり具体的なものを探していると思いますが、リバースエンジニアリングするのではなく、適切な参照があればいいでしょう。

現時点では、Chrome はフォームに入力しませんが、Safari はほとんどのフォームに入力します。一度に 2 つの質問をするリスクがあります。Safari のリファレンスも取得した人はいますか? Safari は title= フィールドを使用しているようです...

この規格を使用していませんね。http://www.ietf.org/rfc/rfc3106.txt

4

3 に答える 3

6

この質問はかなり古いですが、2017 年の最新の回答があります。

オートコンプリートをトリガーする方法に関する完全なドキュメントが作成されました。

これは、オートコンプリートを有効にするための公式の現在の WHATWG HTML 標準へのリンクです。

次の回答は、ここからの私の元の回答からのものです: https://stackoverflow.com/a/41965106/1696153

Google は、モバイル デバイスに適した Web アプリケーションを開発するための非常に優れたガイドを作成しました。自動入力を簡単に使用できるように、フォームの入力に名前を付ける方法に関するセクションがあります。モバイル向けに書かれていますが、これはデスクトップとモバイルの両方に当てはまります。

HTML フォームでオートコンプリートを有効にする方法

オートコンプリートを有効にする方法の重要なポイントを次に示します。

  • <label>すべての<input>フィールドにa を使用します
  • autocomplete<input>タグに属性を追加し、このガイドを使用して入力します。
  • すべてのタグについてname、autocomplete属性に正しい名前を付けます<input>

  • 例：

    <label for="frmNameA">Name</label>
<input type="text" name="name" id="frmNameA"
placeholder="Full name" required autocomplete="name">

<label for="frmEmailA">Email</label>
<input type="email" name="email" id="frmEmailA"
placeholder="name@example.com" required autocomplete="email">

<!-- note that "emailC" will not be autocompleted -->
<label for="frmEmailC">Confirm Email</label>
<input type="email" name="emailC" id="frmEmailC"
placeholder="name@example.com" required autocomplete="email">

<label for="frmPhoneNumA">Phone</label>
<input type="tel" name="phone" id="frmPhoneNumA"
placeholder="+1-555-555-1212" required autocomplete="tel">

<input>タグに名前を付ける方法

In order to trigger autocomplete, make sure you correctly name the name and autocomplete attributes in your <input> tags. This will automatically allow for autocomplete on forms. Make sure also to have a <label>! This information can also be found here.

Here's how to name your inputs:

  • Name
    • Use any of these for name: name fname mname lname
    • Use any of these for autocomplete:
      • name (for full name)
      • given-name (for first name)
      • additional-name (for middle name)
      • family-name (for last name)
    • Example: <input type="text" name="fname" autocomplete="given-name">
  • Email
    • Use any of these for name: email
    • Use any of these for autocomplete: email
    • Example: <input type="text" name="email" autocomplete="email">
  • Address
    • Use any of these for name: address city region province state zip zip2 postal country
    • Use any of these for autocomplete:
      • For one address input:
        • street-address
      • For two address inputs:
        • address-line1
        • address-line2
      • address-level1 (state or province)
      • address-level2 (city)
      • postal-code (zip code)
      • country
  • Phone
    • Use any of these for name: phone mobile country-code area-code exchange suffix ext
    • Use any of these for autocomplete: tel
  • Credit Card
    • Use any of these for name: ccname cardnumber cvc ccmonth ccyear exp-date card-type
    • Use any of these for autocomplete:
      • cc-name
      • cc-number
      • cc-csc
      • cc-exp-month
      • cc-exp-year
      • cc-exp
      • cc-type
  • Usernames
    • Use any of these for name: username
    • Use any of these for autocomplete: username
  • Passwords
    • Use any of these for name: password
    • Use any of these for autocomplete:
      • current-password (for sign-in forms)
      • new-password (for sign-up and password-change forms)

Resources

于 2017-01-31T18:51:45.160 に答える
5

「期待される」可能性のあるものはたくさんありますが ( RFC3106やhCard 形式のものなど)、最終的にはChromium ソース コードで見つけることができるものになると思います。

Chromium の AutoFill 実装と思われるこの特定のセクションは、おそらくあなたにとって興味深いものです。Google Code Project Hostingで利用できるようになった ChromiumのGoogle Code Search機能を使用して見つけました。

一部の定数は、正規表現に使用されるextern-edautofill_regex_constants.hで定義され、かなり広範なリストで提供されます(I18N をサポートしている場合でも!) autofill_regex_constants.cc.utf8.

于 2012-02-29T01:19:09.047 に答える
0

Chrome (v51.0) は次の仕様を実装しているようです: https://html.spec.whatwg.org/multipage/forms.html#autofill

これは、autocompleteChrome が入力する特定のタイプの値を属性に入力できることを意味します。

例:

<input type="text" autocomplete="address-line1" id="a1" name="a1" />
<input type="text" autocomplete="address-line2" id="a2" name="a2" />
<input type="text" autocomplete="address-level2" id="city" name="city" />
<input type="text" autocomplete="address-level1" id="state" name="state" />
<input type="text" autocomplete="country-name" id="country" name="country" />

<input type="text" autocomplete="tel" id="phone" name="phone" />
<input type="text" autocomplete="email" id="email" name="email" />

（明らかに、例のラベルを省略しました）

于 2016-07-12T19:06:59.480 に答える