zoukankan      html  css  js  c++  java
  • HTML5 input事件检测输入框变化

    之前一直用change事件来监听输入框内容是否发生变化,只有当输入框失去焦点时才会触发,没想到html5还有个input事件,只要输入框内容发生变化就会立即触发,既然有这么好的东西我们干嘛放着不用呢,接下来就来给大家介绍一下:

    如果我们页面上有这样一个简单到极致的输入框:

    1 <input type="text">

    那么我们现在用jquery给它绑定input事件,如下:

    1 $("input:text").bind("input propertychange",function(){
    2 
    3   console.log($(this).val().length);//打印输入框字符长度
    4 
    5 });

    这样一来只要输入框内容发生变化,都会立即打印出里面字符串的长度来了。

    需要注意的是input事件是html5的东东,IE9以下版本中是无法支持的,所以需要用propertychange事件来代替。

    input事件除了能够监听input:text元素的内容变化,同时还可以监听input:password,input:search以及textarea这几个元素,在html绑定的写法为:

    1 <input type="text" oninput="onInput(event)" onpropertychange="onPropertyChange(event)">
  • 相关阅读:
    svn版本更新
    前端复选框的全选与获取数据
    关于博主的职业生涯历程
    Presto部署指南
    linux下简单好用的端口映射转发工具rinetd
    阿里云时间服务器
    mongodb常用操作
    mysql常用操作
    mysql内存分配问题
    zabbix微信发送消息脚本
  • 原文地址:https://www.cnblogs.com/luozhihao/p/4649868.html
Copyright © 2011-2022 走看看