input实时监听输入

input根据实时输入的值进行内容检索是常见的业务场景,但使用change,或者keypress等事件绑定在遇到复制粘贴的时候则不会触发事件的发生,无法做到实时监听。解决的方法就是同时使用input propertychange事件进行绑定。例:

    $('input').on('input propertychange',function(){
});

但该方法有一个问题,就是当我们使用中文输入的时候,比如我要打一个”好“字,在我敲键盘‘H’键的时候,事件就已经触发了,而我们需要的是,但我完整地敲完‘hao’之后,选择了”好“字,之后才触发事件执行。这里提供个人的一个思路,就是在事件触发之后,对输入值进行中文验证,如果为true,说明我已经输入了一个完整的中文字符,也就是可以进行检索(其他程序)了。

    $('input').on('input propertychange',function(){
         var $this_val = $(this).val();  
            var re = /^[\u4e00-\u9fa5]+$/;  //中文的正则表达式
            if(re.test($this_val)){
                ...
            }
});

另外,该方法也有一种情况下不会被触发,那就是动态的给input赋值。如:

      $('input').val('好好学习,天天向上');

页面上可以看到input的值变化为‘好好学习,天天向上’,但事件并没有被触发执行。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,991评论 19 139
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,532评论 25 708
  • (续jQuery基础(1)) 第5章 DOM节点的复制与替换 (1)DOM拷贝clone() 克隆节点是DOM的常...
    凛0_0阅读 1,370评论 0 8
  • 轮回 百世 天地混沌一片 无能的探索 查不到自己和世界 没入天池不见 明镜灵台 世上所有人被自己羁绊 唱断 离殇 ...
    濡江生阅读 156评论 0 0
  • 夜静人未眠,灯稀愁绪浓。 青春付一人,枉度十年情。 离家日已久,始觉思旧土。 纵有凌云志,倦鸟归旧林。 断舍离得去...
    山长说阅读 521评论 0 0