SQLの窓

2010年07月09日


JavaScript による入力制限( attachEvent と addEventListener を使った場合 )

JavaScript による入力制限( 0〜9 と BackSpace と左右矢印キーしか入力できないフィールド )
のイベントを attachEvent と addEventListener で登録しています。
メソッドで登録した場合、function の第一引数には、イベントオブジェクトが
引き渡されます。
<script type="text/javascript">

function numField(evt) {

	var btype = window.navigator.userAgent.toLowerCase();

	// *************************************************
	// IE、Opera
	// *************************************************
	if ( btype.indexOf("msie") > -1 || btype.indexOf("opera") > -1	) {
		if ( 48 <= evt.keyCode && evt.keyCode <= 57 ) {
			return;
		}
		if ( evt.keyCode == 8 ) {
			return;
		}
		if ( btype.indexOf("opera") > -1 ) {
			if ( evt.keyCode == 37 || evt.keyCode == 39 ) {
				return;
			}
		}

		evt.returnValue = false;
	}
	else {
		if ( 48 <= evt.charCode && evt.charCode <= 57 ) {
			return;
		}
		if ( evt.charCode == 0 ) {
			if ( evt.keyCode == 8 ) {
				return;
			}
			if ( evt.keyCode == 37 || evt.keyCode == 39 ) {
				return;
			}
		}
		evt.preventDefault();
	}

}

function numKeyDown(evt) {

	var btype = window.navigator.userAgent.toLowerCase();

	// *************************************************
	// IE
	// *************************************************
	if ( btype.indexOf("msie") > -1	) {
		if ( evt.keyCode == 46 ) {
			evt.returnValue = false;
		}
	}
	// *************************************************
	// Chrome
	// *************************************************
	if ( btype.indexOf("chrome") > -1	) {
		if ( evt.keyCode == 46 ) {
			evt.preventDefault();
		}
	}

}

</script>

<INPUT id="num" type=text>

<script type="text/javascript">

var obj = document.getElementById("num")

// *************************************************
// IE 用
// *************************************************
if (window.attachEvent){
	obj.attachEvent('onkeypress', numField);
	obj.attachEvent('onkeydown', numKeyDown);
}
// *************************************************
// IE 以外
// *************************************************
else {
	obj.addEventListener('keypress', numField, false);
	obj.addEventListener('keydown', numKeyDown, false);
}

</script>



posted by at 09:07 | JavaScript | このブログの読者になる | 更新情報をチェックする