input监听

 1 //1.bind
 2 $("#id").bind('input propertychange',function(){
 3 
 4 });
 5 
 6 //2.live
 7 $("#id").live('input propertychange',function(){
 8 
 9 });
10 
11     

bind:在绑定bind时就会判断绑定对象是否存在,只针对于当前对象绑定,js等新生成后增加元素不能绑定

live:弥补bind缺陷,对js等新生成的元素也进行绑定

转载于:https://www.cnblogs.com/shizijie/p/6720202.html

### Layui Input 元素监听事件方法 对于希望在 Layui 框架中为 `input` 元素添加监听事件的需求,可以通过特定的方式实现。Layui 提供了多种方式来处理不同类型的输入变化。 #### 使用内置的 change 事件监听器 为了确保能够有效监听到 `input` 的改变,在 HTML 部分应给目标元素设置属性 `lay-filter="someFilter"` 。此过滤器名称用于关联 JavaScript 中定义的行为逻辑[^2]: ```html <div class="layui-inline"> <label class="layui-form-label">用户名</label> <div class="layui-input-block"> <input type="text" id="username" name="title" required lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input" lay-filter="usernameInput"> </div> </div> ``` 接着可以在脚本部分通过调用 `.on()` 方法绑定相应的回调函数至该过滤器上: ```javascript layui.use(['form'], function(){ var form = layui.form; // 监听指定 filter 的 input 变化 form.on('change(usernameInput)', function(data){ console.log(data.elem); // 得到当前被选中的元素 DOM 对象 console.log(data.value); // 获取当前值 }); }); ``` 需要注意的是上述例子使用了 `change` 而不是原始描述里的 `inputpropertychange`,因为后者并不是标准浏览器支持的标准事件名;而前者则是广泛接受并由 Layui 支持的一种形式。 另外一种更通用的做法是利用 jQuery 或者原生 JS 来捕获即时的变化情况,比如当用户正在键入文字时触发某些操作: ```javascript // 假设已经加载了jQuery库 $('#username').on('input', function() { alert($(this).val()); }); // 如果不依赖于任何额外库,则可以直接采用纯JS版本 document.getElementById('username').addEventListener('input', function(event) { alert(event.target.value); }); ``` 以上两种方案都可以很好地满足实时获取用户输入内容的需求,并且适用于大多数场景下的开发工作。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值