如何在iOS Safari上使用datalist？

Question

我有一个关于 iOS Safari 如何处理数据列表的问题。

以下代码在所有桌面浏览器上都可以正常工作。

<!DOCTYPE html>
<html>
 
<body>
    <form action="">
        <label>Favorite fruit: </label>
        <input list="fruits" id="fruitsInput" autocomplete='off' autocorrect='off' spellcheck='off'/>
        <datalist id="fruits">
            <option value="Apple">Apple</option>/>
            <option value="Peaches">Peaches</option>/>
            <option value="Pear">Pear</option> />
            <option value="Apricot">Apricot</option> />
            <option value="Banana">Banana</option> />
        </datalist>
        
        <button onclick="datalistcall()" type="button">
            Click Here
        </button>
    </form>

<p id="output"></p>
    <script type="text/javascript">
        function datalistcall() {
            var o1 = document.getElementById("fruitsInput").value;
            document.getElementById("output").innerHTML =
                "You select " + o1 + " option";
        }
    </script>
</body>
 
</html>

它显示一个可以通过数据列表菜单填充的文本字段。单击按钮时，将显示所选项目。

在 iOS Safari 上，输入字段显示有一个小箭头来显示菜单，它也工作正常。但数据列表当然也用于开始输入，浏览器通常会调整菜单相应的项目。在 iOS Safari 上，不显示菜单，而是将相关项目显示在键盘上方的一行上（参见图 1）。然后您可以选择一个项目，然后……什么也没有发生！项目列表消失（参见图 2），输入字段中没有任何变化，也没有触发任何事件。

我是否遗漏了什么或者数据列表在 iOS safari 上无法使用？

Answer 1

ios更新17.4.1后也有同样的问题。在 Chrome 和 Safari 上。在以前的版本上它工作得很好。并且仍然没有如何修复它的信息（

如何在iOS Safari上使用datalist？

问题描述投票：0回答：1

1个回答

最新问题

如何在iOS Safari上使用datalist？

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1