论坛首页 Web前端技术论坛

文本框中禁止使用输入法

浏览 7402 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2012-06-11  

今天碰到一个问题,在一个文本框中要求只能输入数字,于是我做了如下限制

1、在文本框上添加处理函数onkeypress="onlyNumberAndCharInput()

2、在JS中添加对应的function

//仅输入数字和字母

function onlyNumberAndCharInput()
{
  if ((event.keyCode>=48 && event.keyCode<=57) || 

(event.keyCode>=65 && event.keyCode<=90) || (event.keyCode>=97 && 

event.keyCode<=122))
  {
    event.returnValue=true;
  }
  else
  {
    event.returnValue=false;
  }
}
 

但是测试告诉我说这个时候可以输入汉字,让修改下,于是又加上了禁用输入法
style="ime-mode:disabled" 

 

   发表时间:2012-07-02  
哪有这么麻烦
js版
<input type="text" onkeyup="value=value.replace(/[^0-9.]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^0-9.]/g,''))"/>

jQuery版
$(function() {

	$('.integer').bind({
		keyup : function() {
			$(this).val($(this).val().replace(/[^\d]/g, ''));
		}
	});

	$('.integer').each(function() {
		var _input = $(this)[0];
		if (_input.attachEvent) {
			_input.attachEvent('onbeforepaste', formatPasteDataToInteger);
		} else {
			_input.addEventListener('onbeforepaste', formatPasteDataToInteger, false);
		}
	});
	
	$('.float').bind({
		keyup : function() {
			$(this).val($(this).val().replace(/[^0-9.]/g, ''));
		}
	});
	
	$('.float').each(function() {
		var _input = $(this)[0];
		if (_input.attachEvent) {
			_input.attachEvent('onbeforepaste', formatPasteDataToFloat);
		} else {
			_input.addEventListener('onbeforepaste', formatPasteDataToFloat, false);
		}
	});

	function formatPasteDataToInteger() {
		clipboardData.setData('text', clipboardData.getData('text').replace(/[^\d]/g, ''));
	}

	function formatPasteDataToFloat() {
		clipboardData.setData('text', clipboardData.getData('text').replace(/[^0-9.]/g, ''));
	}

});


<input type="text" class="integer"/>
<input type="text" class="float"/>
0 请登录后投票
   发表时间:2012-07-02  
anlystar 写道
哪有这么麻烦
js版
<input type="text" onkeyup="value=value.replace(/[^0-9.]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^0-9.]/g,''))"/>

jQuery版
$(function() {

	$('.integer').bind({
		keyup : function() {
			$(this).val($(this).val().replace(/[^\d]/g, ''));
		}
	});

	$('.integer').each(function() {
		var _input = $(this)[0];
		if (_input.attachEvent) {
			_input.attachEvent('onbeforepaste', formatPasteDataToInteger);
		} else {
			_input.addEventListener('onbeforepaste', formatPasteDataToInteger, false);
		}
	});
	
	$('.float').bind({
		keyup : function() {
			$(this).val($(this).val().replace(/[^0-9.]/g, ''));
		}
	});
	
	$('.float').each(function() {
		var _input = $(this)[0];
		if (_input.attachEvent) {
			_input.attachEvent('onbeforepaste', formatPasteDataToFloat);
		} else {
			_input.addEventListener('onbeforepaste', formatPasteDataToFloat, false);
		}
	});

	function formatPasteDataToInteger() {
		clipboardData.setData('text', clipboardData.getData('text').replace(/[^\d]/g, ''));
	}

	function formatPasteDataToFloat() {
		clipboardData.setData('text', clipboardData.getData('text').replace(/[^0-9.]/g, ''));
	}

});


<input type="text" class="integer"/>
<input type="text" class="float"/>

呵呵,只是方法不同而已。很早之前就像用兄弟这种正则表达式的判断了,无奈正则表达式很差劲啊,最近在学习呢
0 请登录后投票
   发表时间:2012-07-02  
正则完全可以搜,主要还是思路上,具体的代码都可以google,思路不好google呀
0 请登录后投票
   发表时间:2012-07-02  
anlystar 写道
正则完全可以搜,主要还是思路上,具体的代码都可以google,思路不好google呀


呵呵,当时很着急,所以就按照公司的以为JS高手的思路改了
0 请登录后投票
   发表时间:2012-07-05  
你试试,你这个 如果是粘贴进去的呢?
0 请登录后投票
   发表时间:2012-07-05  
anlystar 写道
你试试,你这个 如果是粘贴进去的呢?

汉字是粘贴不进去的吧?
0 请登录后投票
   发表时间:2012-07-05  
看着你哪个好像可以
0 请登录后投票
   发表时间:2012-07-05  
anlystar 写道
看着你哪个好像可以


我试过了不行
0 请登录后投票
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics