onpropertychange事件 onchange无法捕获时

最新推荐文章于 2023-10-24 14:30:04 发布
最新推荐文章于 2023-10-24 14:30:04 发布
阅读量613 收藏
点赞数
分类专栏： Javascript学习 文章标签： 测试 button input 脚本 html

 当一个HTML元素的属性用js改变的时候，都能通过 onpropertychange来捕获。例如一个 <input name="text1" id="text1" />对象的value属性被页面的脚本修改的时候，onchange无法捕获到，而onpropertychange却能够捕获。
也就是说：onpropertychange事件在用键盘每改变一下文本框的值或用js改变其值便会触发一下，而onchange只有在用键盘改变其值，然后在失去焦点(onblur)后才触发，用js改变其值不能触发!onpropertychange和onchange都不管文本框中的实际值有没有变，只要有改的相应操作就可能触发。有时当上面两时间都不能满足需求时，可以考虑只用onblur。 

还有一点要注意到，当onblur和onchange事件一起用时，onblur会出问题。。。。详见如下 

测试页面： 

<html> 
<head> <title>通过js改变文本框中的值后触发的事件：onpropertychange事件 </title> </head> 
<body> 

<div    id="test1"> 
<b>测试onpropertychange事件和onchange事件一起用时： </b> <br> 
<font color="red">测试结果：onpropertychange事件在用键盘每改变一下文本框的值或用js改变其值便会触发一下，而onchange只有在用键盘改变其值，然后在失去焦点后才触 

发，用js改变其值不触发 </font> 
<br> 
<input name="haha1"    type="text" onpropertychange="alert('触发了onpropertychange事件！')" οnchange="alert('触发了onchange事件！')" size="30" > 
<input name="testbutton1" value="通过js改变文本框中的值" type="button" οnclick="document.getElementById('haha1').value='js改变文本框后的值'"> 
<br> 
<br> 
<br> 

<div id="test2"> 
<b>测试只有onblur和onchange事件时： </b> <br> 
<font color="red">测试结果：onchange先触发，onblur后触发 </font> 
<br> 
<input name="haha2"    type="text" οnblur="alert('触发了onblur事件！')"    οnchange="alert('触发了onchange事件！')" size="30" > 
<input name="testbutton2" value="通过js改变文本框中的值" type="button" οnclick="document.getElementById('haha2').value='js改变文本框后的值'"> 
<br> 
<div> 
<br> 
<br> 
<br> 


<div    id="test3"> 
<b>测试当onblur和onpropertychange事件一起用时： </b> <br> 
<font color="red">测试结果：onblur好象出了问题，只要用键盘在文本框中随便输入一个值，便会触发它。可能是onpropertychange把它惹毛了。。。^-^ </font> 
<br> 
<input name="haha3"    type="text" οnblur="alert('触发了onblur事件！')" onpropertychange="alert('触发了onpropertychange事件！')"    size="30" > 
<input name="testbutton3" value="通过js改变文本框中的值" type="button" οnclick="document.getElementById('haha3').value='js改变文本框后的值'"> 
<br> 
<div> 
<br> 
<br> 
<br> 


<div    id="test4"> 
<b>测试有onblur、onpropertychange事件和onchange事件一起用时： </b> <br> 
<font color="red">测试结果：onblur在和onpropertychange一起用时的问题仍然存在 </font> 
<br> 
<input name="haha4"    type="text" οnblur="alert('触发了onblur事件！')" onpropertychange="alert('触发了onpropertychange事件！')" οnchange="alert('触发了 

onchange事件！')" size="30" > 
<input name="testbutton4" value="通过js改变文本框中的值" type="button" οnclick="document.getElementById('haha4').value='js改变文本框后的值'"> 
<br> 
<div> 

</body> 
</html>

 
aikesi117
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JS中onpropertychange和onchange事件区别小结
01-19
也就是说：onpropertychange事件在用... 还有一点要注意到，当onblur和onchange事件一起用时，onblur会出问题。。。。详见如下 测试页面： 通过js改变文本框中的值后触发的事件：onpropertychange事件 测试onprop
js针对文本框输入值改变的oninput事件和onchange事件
Lemon_MY的博客
12-09 5832
oninput事件 1.oninput 事件在用户输入时触发。 2.该事件在 或 元素的值发生改变时触发。 oninput 事件是 IE 之外的大多数浏览器支持的事件，在 value 改变时触发，实时的，即每增加或删除一个字符就会触发，然而通过 js 改变 value 时，却不会触发。 3.oninput 事件：a). 当脚本中改变 value 时，不会触发；b).从浏览器的自动下拉提示中选取时，不会触发。 提示： 该事件类似于 onchange 事件。不同之处在于 oninput 事件在元素值发生变化
LabVIEW学习笔记十一：用值（信号）实现，捕捉由程序修改控件值产生的“值改变”事件
创世纪GENESIS
09-02 2166
在使用事件结构的时候，在事件分支中响应前面板中的一个显示控件的值改变事件，该显示控件在程序的其他部分动态改变其值。b灯可以由按钮b控制（b按键可以发送b指令），a灯可以由按钮a控制（a按键可以发送a指令），如果在a指令里加一些计算（比如让本指令a完成后执行下一条指令b），那么按下按键a就能发送指令a，并且发送指令b，简化程序结构。使用了这个值（信号）后，点了按钮a之后，按钮a的值改变触发了事件结构，这个事件结构里有一个按钮b的值（信号），这个时候，程序会认为按钮b的值改变，从而触发了下面的事件结构。
JS的onpropertychange方法怎么使用？
热门推荐
ios0213的专栏
06-18 1万+
onpropertychange事件，顾名思义，就是property(属性)change(改变)的时候，触发事件。这是IE专有的！如果想兼容其它浏览器，有个类似的事件，oninput！ onpropertychange会在设置disable=true的时候失效。而且，onpropertychange是在触发对象改变任何属性时都会触发。而oninput只是在改变input的value值时才触发
有关onpropertychange事件
weixin_30706691的博客
01-29 262
XML/HTML代码 <inputtype="text"value="xxx"id="xx"onclick="this.myprop='xx'"> <scripttype="text/javascript"> <!-- document.getElementById('xx').attachEvent('onpropert...
值改变事件(SMART PLC梯形图FC)
最新发布
RXXW_Dor的博客
10-24 239
TITLE=值改变事件触发功能块VAR_INPUTINPUT:DINT;// 当前输入值END_VARVAR_IN_OUT// 上一时刻数值END_VARVAR_OUTPUT// 值改变触发输出、只持续一个扫描周期END_VARBEGINNetwork 1// 值改变事件触发LD SM0.0= L8.0Network 2LD SM0.0。
js中的onchange和onpropertychange (onchange无效的解决方法)
10-26
主要介绍了js中的onchange和onpropertychange (onchange无效的解决方法)，需要的朋友可以过来参考下，希望对大家有所帮助
javascript开发中使用onpropertychange,oninput事件解决onchange事件的不足
12-12
在IE下,可以用onpropertychange来代替onchange事件,当文本框有任何变化时,能立即触发此事件. 这样一来问题就解决了. 那其他浏览器呢,onpropertychange可是IE的专利. 接下来就是oninput事件了. 但是oninput有个诡异,...
input 内容改变的触发事件
MaQuanXin的博客
06-28 1196
input 内容改变的触发事件 onchange onchange 事件会在域的内容改变时触发。支持的标签, , ,。 注意：在元素的值改变了且失去焦点时触发（两次的值一样不会触发）。 缺陷：通过js代码改变DOM的值不会触发，解决在js代码里改值了调用其change 的function() 或者调.change()方法。 JS： <input type="text" id="cc" o...
【Code】JS-propertychange事件，实现实时金额计算
Rookie_Shawn
04-14 2252
前台页面HTML代码<div class="wrapper"> <ul class="withdraw"> <li> <span class="left">充值金额</span> <span class="right"><input type="tel" id='money_input' placeholder="输入充值金额"
jQuery文本值改变的事件绑定(input/span/div)
猿学
12-15 2446
keypress：按键按下时触发事件（先响应事件，再显示输入结果（获得的是上一次结果），可能被输入法拦截）propertychange：属性改变时触发事件（不管是获得焦点还是value改变等）change：焦点离开时触发事件。focus：获得焦点时触发事件。keyup：按键弹起时触发事件。
html+文本值改变事件,html中文本值改变事件
weixin_35284593的博客
06-07 1437
当一个HTML元素的属性用js改变的时候，都能通过 onpropertychange来捕获。例如一个 对象的value属性被页面的脚本修改的时候，onchange无法捕获到，而onpropertychange却能够捕获。也就是说：onpropertychange事件在用键盘每改变一下文本框的值或用js改变其值便会触发一下，而onchange只有在用键盘改变其值，然后在失去焦点(onblur)后才触...
JavaScript中的onchange、oninput以及onpropertychange
snowstorm的博客
04-23 1129
一、onchange事件属性 onchange事件可以用于元素和元素，表示当内容改变并且失去焦点后触发，onchange也可以用于元素，当改变选择的项时会触发此事件。 但是要注意，在js代码中改变input的value值或者改变框中的值，或者改变的选中项（这个可以通过给select对象的selectedIndex属性赋值来实现），这些情况均不能触发onchange事件。那该怎么办呢，其实我们可
jquery文本框改变事件
客官里边请的博客
08-11 6310
jquery文本框改变事件
html p 内容改变事件,监听文本框内容改变事件之oninput、onchange与onp
weixin_35924765的博客
06-07 1117
监听文本框内容改变事件是一个很常见的需求，比如动态提示还能输入多少字。但是在实际应用的过程中，会有很多意想不到的坑。onchange事件只在键盘或者鼠标操作改变对象属性，且失去焦点时触发，脚本触发无效onkeydown/onkeypress/onkeyup在处理复制、粘贴、拖拽、长按键(按住键盘不放)等细节上并不完善onpropertychange此属性可在某些情况下解决上面存在的问题，不用考虑是...
jquery当span或者div内容变化时触发事件
qq_42365842的博客
05-17 1706
点赞按钮和点赞数 <div class="send-like"> <div class="heart " id="like1" rel="like"></div> <div class="likeCount" id="likeCount1">14</div> </div> 当点赞数改变时触发事件发送ajax请求保存当前的点赞数 $("#likeCount1").bind("DOMNodeInserted",
html input text onchange,input 标签内容改变，onchange触发事件
weixin_35679132的博客
06-15 3052
1. onchangeonchange 事件会在域的内容改变时触发。支持的标签, , ,。注意：在元素的值改变了且失去焦点时触发(两次的值一样不会触发)。缺陷：通过js代码改变dom的值不会触发，解决在js代码里改值了调用其change 的*function()*或者调.change()方法。js：jquery:$("#cc").change(function(){});2. onpropert...
javascript监听输入框_js监听输入框值的即时变化onpropertychange、oninput
weixin_39835147的博客
12-22 556
要达到的效果很多情况下我们都会即时监听输入框值的变化，以便作出即时动作去引导浏览者增强网站的用户体验感。比如即时显示输入框已经被输入的字节数，或者即时读取输入的值来进行搜索引导，也就是google的关联搜索效果等。只要我们能捕获即时事件就能做到很多事情。需要了解的知识首先，我们需要了解onchange和onpropertychange的不同：IE下，当一个HTML元素的属性改变的时候，都能通过 o...
th:onPropertyChange
05-30
`th:onPropertyChange` 是 Thymeleaf 模板引擎中的一个属性，用于在表单输入控件的值发生变化时触发对应的方法。该属性通常与 Thymeleaf 的表单绑定功能一起使用，可以实现实时更新表单数据的效果。需要注意的是，`...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值