【问题标题】:HTML Drop Down not selecting options in iPhone's IOS 13HTML Drop Down 未在 iPhone 的 IOS 13 中选择选项
【发布时间】:2021-02-06 03:18:38
【问题描述】:

我实现了一个 Web 应用程序,它有一个下拉菜单(即 HTML 选择)。如果我尝试在下拉菜单中选择任何选项,它不会触发更改事件,但它会成功更新标签文本。

  • 设备:iPhone 11 或最新版本
  • 操作系统:IOS 13 或最新版本
  • 浏览器:Safari

示例代码:

<select id="storagetype">
    <option value="" selected>Select Storage Type</option>
    <option value="1" selected>ABC</option>
    <option value="2" selected>XYZ</option>
</select>

JavaScript:

var storagetype = document.getElementById("storagetype");

storagetype.addEventListener("change", function() {
    alert(storagetype.value)
});

如果我在 IOS 12.X 或更低版本中尝试相同的操作,它会按预期工作。

此外,没有控制台错误,我尝试了 z-index 样式。但没有任何效果。

【问题讨论】:

    标签: ios html-select onchange ios13.3 iphone11


    【解决方案1】:

    在下面的代码中添加过滤器来检测 iphone 然后使用它。

    Javascript:

     document.addEventListener('click', function (params) {
     document.querySelectorAll('li[id^="select-options"]').forEach(ele => {
     ele.addEventListener('touchend', (e) => {
     e.stopPropagation();
       })   
      }); 
    });
    

    jquery:

    $(document).click(function(){
      $('li[id^="select-options"]').on('touchend', function (e) {
        e.stopPropagation();
      }); 
    });
    

    【讨论】:

    • 停止 touchend 事件并让 click 事件完成工作。
    猜你喜欢
    • 1970-01-01
    • 2021-04-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-07-17
    • 1970-01-01
    相关资源
    最近更新 更多