移动端(html5)微信公众号下用keyup实时监控input值的变化无效_微信小程序 input值变化监听不到-优快云博客

本文介绍了一个具体的前端开发场景，即如何在输入框值发生变化时进行有效监听，并解决了在不同输入法环境下遇到的问题。同时，还讨论了在IE9浏览器中使用oninput和onpropertychange事件时的特殊注意事项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<div class="weui_cell_primary">									
										<input id="investmentAmount" name="investmentAmount" style="font-size: 14px; width: 100%; line-height: 40px;"
											pattern="[0-9]*" type="tel" maxlength="10"
											placeholder="100起投" value="${investAmount}"
											onblur="countInterest();" oninput="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')};changeCoupons();" onpropertychange="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')};changeCoupons();" onafterpaste="if(this.value.length==1){this.value=this.value.replace(/[^1-9]/g,'')}else{this.value=this.value.replace(/\D/g,'')};"/>
									</div>

//金额改变
	function changeCoupons(){
		var amount = getInvestmentAmount();
		if (isNaN(amount) || amount == 0 || amount == null) {
			$("#interest").val("0.00");
			return;
		}
		var loanMoney=$("#loanMoney").val();
		
		if(parseFloat(amount)<parseFloat(loanMoney)){
			$("#userCouponRate").val("");
			$("#userCouponId").val("");
			$("#selectCoupon").html('该优惠券不可用');
			$("#indeX").val("-1");
		}
	}

公众平台开发时，客户提需求“输入框中输入内容时，输入框后边显示清除按钮，清除输入框中的内容”，使用“keyup”事件时在中文输入法下部分按键keyup事件无效。

最后需要注意的是：oninput 和 onpropertychange 这两个事件在 IE9 中都有个小BUG，那就是通过右键菜单菜单中的剪切和删除命令删除内容的时候不会触发，而 IE 其他版本都是正常的，目前还没有很好的解决方案。不过 oninput & onpropertychange 仍然是监听输入框值变化的最佳方案。