onpropertychange与输入法有关

最新推荐文章于 2021-04-13 10:37:05 发布

原创最新推荐文章于 2021-04-13 10:37:05 发布 · 186 阅读

0 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

23 篇文章

订阅专栏

本文探讨了在HTML页面中创建一个只允许输入数字和一个小数点的输入框，并解决了在不同输入法环境下可能出现的崩溃问题。通过使用onpropertychange和特定属性设置，实现了对输入内容的有效控制，避免了中文或其他非数字字符的误输入。

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

页面输入框经常有只允许输入数字的限制，一般都用onpropertychange事件比较简单，之前写了这样的代码

   var obj=document.getElementById("input1");

   if(isNaN(obj.value))
   { 
     obj.value="";
   }

在别人机器上运行没问题，但是一到我机器输入中文就会奔溃，最后发现他用的是google输入法，我是搜狗的（qq输入法也会崩溃），但是将onproperychange换成onblur方法又不会有问题，不知道具体原因，以下是另一种解决办法，引用自黑色头发:http://heisetoufa.iteye.com，留作参考

<input onpropertychange="if(isNaN(value)) value=value.substring(0,value.length-1);" style="ime-mode:disabled; " onpaste="return false" onkeypress="return event.keyCode!=32">

只能输入数字和1个小数点，不能输入数字和小数点外的其他任何字符包括空格

onpropertychange="if(isNaN(value)) value=value.substring(0,value.length-1);" //只能输入数字和小数点

style="ime-mode:disabled; " //屏蔽输入法，不允许输入汉字

onpaste="return false" //不允许粘贴

onkeypress="return event.keyCode!=32" //不允许输入空格

注意：很容易犯以下的错误

function isNumber()
{
   var obj=document.getElementById("input1");
   var intvalue=parseFloat(obj.value);
   if(isNaN(intvalue))
   { 
     obj.value="";
   }
}

这种方法实际是不对的，因为parseFloat()方法仅仅在字符串的第一个字符不能被转换为数字才会返回 NaN，如果是12sss，则返回12，所以不能通过先转化再判断NaN，倒是应该再转换之前判断是否NaN