HTMLのautocompleteがうまく機能しない

前提・実現したいこと

monacaでスマホアプリを作成しています。

2つの入力フォームに対してそれぞれ、inputタグのautocompleteをonにして入力補完機能を使おうとしています。

発生している問題・エラーメッセージ

monacaのデバッガー上の入力フォームでは正常に入力補完が働くのですが、
スマホアプリの「Monaca Debugger」では機能しません。

具体的には、
１．入力フォームをタップすると、それぞれに対応した補完リストがちゃんと表示される。
２．補完リストをタップすれば、その単語が入力フォームに入力される。
３．別の入力フォームをタップすれば、補完リストが表示される。
４．その補完リストをタップしても入力フォームに入力されない！

どうすれば入力補完機能をうまく使えるでしょうか。

該当のソースコード

HTML
1<body>
2  <page id="main">
3    <input autocomplete="on" list="list1">
4    </input>
5    <input autocomplete="on" list="list2">
6    </input>
7    <datalist id="list1">
8      <option value="test1"></option>
9      <option value="test2"></option>
10      <option value="test3"></option>
11      <option value="test4"></option>
12    </datalist>
13    <datalist id="list2">
14      <option value="TEST1"></option>
15      <option value="TEST2"></option>
16      <option value="TEST3"></option>
17      <option value="TEST4"></option>
18    </datalist>
19  </page>
20</body>
21

行動規範の内容に同意します

回答1件

環境ないので単に「やってみて」レベルの回答になりますが、
name属性やtype属性を明示してみてはどうでしょうか。

投稿2021/11/08 20:46

m.ts10806

総合スコア80861

owan010

2021/11/10 13:07

返信ありがとうございます。 name、typeを追加しましたが駄目でした。また、入力補完はautocompleteではなく、datalistによるものだとわかったのでautocompleteを消して試しましたが駄目でした。どうやら、androidのブラウザによるもので、chromeでは正常に働き、yuzubrowserでは働かないことを確認できました。スマホでは入力補完を使えないのでしょうか？

行動規範の内容に同意します