Buildfire屏幕事件在iOS端不生效 安卓及预览模式运行正常

问题根因及修复方案 #

常见iOS兼容问题排查点

• 事件类型兼容性问题：iOS Safari 已经废弃keypress事件，仅对可打印字符触发该事件，回车键等功能键不会触发，这是最常见的失效原因
• 多余事件冲突：vclick、tap是jQuery Mobile/触摸事件扩展库的专属事件，未引入对应依赖时不会触发，多事件同时绑定反而可能导致iOS下事件触发冲突
• 废弃API兼容问题：jQuery 3.0+已废弃bind方法，官方推荐使用on方法绑定事件，部分iOS环境对旧API的支持存在缺陷
• DOM渲染时机问题：原插件基于Angular开发，可能存在你绑定事件时目标DOM还未渲染完成的情况，直接绑定到元素上会失效

修复后代码

1. 键盘回车触发逻辑修改：

// 改用keydown事件，使用事件委托绑定到document，避免DOM未渲染导致绑定失效
$(document).on('keydown', '#audiosearchtext', function(e) {
      var keyCode = e.which || e.keyCode;
      if (keyCode === 13) { 
        e.preventDefault();
        e.stopPropagation();
        startfilter();
        return false;
      }
});

2. 搜索按钮触发逻辑修改：

// 用on替代bind，移除无效的vclick、tap事件
$(document).on('click', '#searchbtn', function(e) {
    e.preventDefault();
    startfilter();
});

额外兼容处理

如果修改后按钮点击仍然不生效，可以给按钮添加CSS样式cursor: pointer，老版本iOS Safari对未设置鼠标指针样式的元素不会触发click事件。

内容的提问来源于stack exchange，提问作者dgood1