关于使用jquery监控input的值的处理方式

本文介绍了如何使用jQuery实现对input输入框的实时监控,包括利用bind()绑定onpropertychange和oninput事件来追踪文本变化,以及在用户点击按钮时自动填充点数并更新显示。同时,指出了通过脚本直接修改input值不会触发监控的问题,解决方案是在按钮事件处理函数中手动更新显示。
摘要由CSDN通过智能技术生成

在这里插入图片描述

如上图所示,今天实现了一个功能,功能需求如下:

(1)在input中输入文字,文字被jquery监控,实时显示在文本框下面的文字中。
(2)点击“兑换全部点数”按钮,自动将用户全部点数的数值录入到文本框中,并在下方的文字中实时显示出来。

这个功能做起来还是很简单的,需要掌握几个知识点:

第一:如何监控input文本框:

监控input文本框的内容,需要使用bind()来绑定 onpropertychange和oninput两个属性来进行:

  • onpropertychange: IE下,当一个HTML元素的属性改变的时候,都能通过 onpropertychange来即时捕获。onchange在属性值改变时还必须使得当前元素失去焦点(onblur)才可以激活该事件。 在用js脚本改动该元素值时候亦能触发onpropertychange事件。

  • oninput:是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于对象时,并非该对象所有属性改变都能触发事件,它只在对象value值发生改变时奏效。

  • onchange: (a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效);(b)当前对象失去焦点(onblur);

$('.input_cp').bind("input propertychange",function(event){
   
});	

并且在函数体中设置一下

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值