随笔-59  评论-142  文章-1  trackbacks-4

        这个问题应该是老生常谈了,但是始终不好解决,有以下需要进行限制:
        1、敲击键盘只能输入输入数字;
        2、复制的时候也需要删除非数字字符;
        3、使用输入法也应该只认数字;
        4、在页面中选择一段文字,直接拖拽,也应该能进行筛选;

        所以我们需要一个在任何时候只要文本框内容发生变化就触发的事件,来完成上述工作,而不是单纯的onchange事件。

        让我们庆幸的是IE中提供一个onpropertychange事件,他可以捕捉到文本框任何文本变化。接下来就简单了,通过这个事件我们就可以定义以下两个方法来处理整形和浮点数的输入限制。

// Int
function CheckInputInt(oInput)
{
    
if  ('' != oInput.value.replace(/\d/g,''))
    {
        oInput.value 
= oInput.value.replace(/\D/g,'');
    }
}

//Float
function CheckInputFloat(oInput)
{
    
if('' != oInput.value.replace(/\d{1,}\.{0,1}\d{0,}/,''))
    {
        oInput.value 
= oInput.value.match(/\d{1,}\.{0,1}\d{0,}/== null ? '' :oInput.value.match(/\d{1,}\.{0,1}\d{0,}/);
    }
}


HTML Code:

<table>
    
<tbody>
        
<tr>
            
<td>
                该文本框只允许输入整型:
<input type="text" id="input1" name="input1" onpropertychange="javascript:CheckInputInt(this);" />
            
</td>
        
</tr>
        
<tr>
            
<td>
                该文本框允许输入浮点数:
<input type="text" id="input2" name="input2" onpropertychange="javascript:CheckInputFloat(this);" />
            
</td>
        
</tr>
    
</tbody>
</table>


        遗憾的是在FireFox中是没有这个事件的,所以如果是做系统限制客户只能用IE浏览器,这个方法完全实用:)

        而这个事件在IE4.0中就得到了支持,可能FireFox在标准化方面做得是比较出色的,但是对于我来说,只有实用的才是好的。例如,innerHTML、innerText方法相当实用,同样它也不是标准方法。

        当然我只是抛砖引玉,希望如果哪位高人知道FireFox中如何实现,万望告知,谢谢:)

        示例请看这里

posted on 2008-02-19 09:49 马可香蕉 阅读(441) 评论(1)  编辑 收藏 所属分类: JavaScript

评论:
#1楼  2008-07-23 23:18 | stkamen [未注册用户]
还有瑕疵..
输入0000.000还是通过
  回复  引用    

标题  
姓名  
主页
Email (只有博主才能看到) 
验证码 *  看不清,换一张 [登录][注册]
内容(请不要发表任何与政治相关的内容)  
  登录  使用高级评论  新用户注册  返回页首  恢复上次提交      
该文被作者在 2008-02-19 09:53 编辑过


相关链接: