layui在ios下select下拉框lay-search中文检索无法模糊查询 英文可以的解决方法

  • 版本:layui-v2.6.8及以前版本
  • 描述:页面拉取后台数据渲染到下拉框,安卓可以根据中文检索加载后的数据、ios无法根据中文检索(如果数据源中有英文、用英文检索可以。有的ios版本可以中文检索、有的ios版本不可以中文检索)

原因分析:在iOS设备上,特别是在中文输入模式下,用户输入中文的时候,中文输入法会导致高频事件,但是多次按键合成一个文字后又没有触发keyup事件,算是一个小bug。

解决办法是在JavaScript中监听  compositionend 事件,以便在用户完成整个词汇的输入后再进行模糊搜索处理。

处理代码如下:

layui.use(['layer', 'form'], function(){
var $ = layui.$;

     //处理layui框架在ios下无法模糊查询中文的问题
     var inputElement = $(".layui-select-title input[type='text']");
     // 监听compositionend事件
     inputElement.on('compositionend', function(e) {
           // 当compositionend发生时,模拟触发keyup事件
           $(this).trigger('keyup');
     });
});