【问题标题】:Programmatic select() on input type number not working in iOS输入类型编号上的编程选择()在 iOS 中不起作用
【发布时间】:2019-04-25 10:54:15
【问题描述】:

如果我有一个 input 类型为 number 的元素,试图以编程方式调用其上的 select() 函数,则在 Safari 移动版中将无法工作。

运行此代码时

const el = document.querySelector(`#${FIELD1} input`);
if (el) {
 setTimeout(() => {
    el.focus();
    el.select();
    el.setSelectionRange(0, 9999);
  }, 100);
}

焦点将适用于所有平台,但选择仅适用于 Chrome。

有关于这个错误的任何官方信息吗?有什么办法绕过它?

我按照旧帖子中的建议尝试了el.setSelectionRange(0,99),但它似乎不再起作用(而且它不应该出现在该元素的 W3C 规范中)。

PS:我正在使用 Preact。

编辑:问题集中在 iOS 上,它实际上适用于 Safari 桌面。

我创建了一个最小复制:https://codesandbox.io/s/q86m6kv01q 请尝试在您的设备上导航到:https://q86m6kv01q.codesandbox.io/

【问题讨论】:

  • 你可以调用 click() 代替吗?
  • 我无法在 Safari 中尝试,但 select() 在 Firefox 中对我来说工作正常。您在 Firefox 中也有问题吗?控制台中是否出现任何错误?
  • 无法调用click(),但在这种情况下问题也会持续存在,除非点击是真实的而不是合成的。 Firefox 工作正常,问题仅在 iOS 上。

标签: javascript select input focus preact


【解决方案1】:

在 iOS 上调用选择器 UI 需要用户手势。这样做是为了避免随机触发系统 UI(例如在页面加载时)。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-05-23
    • 2018-08-08
    • 1970-01-01
    • 2013-11-27
    • 2011-10-13
    • 1970-01-01
    • 2014-08-24
    • 2021-12-17
    相关资源
    最近更新 更多