[JavaScript] 숫자만 입력 받기


숫자만 입력할 수 있도록하고, min, max, maxlength등을 실시간 처리한다.


<!DOCTYPE html>
<html lang="ko-KR">
<head>

    <meta charset="UTF-8">
<meta name="format-detection" content="telephone=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
   
    <title>숫자만 입력받기</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=medium-dpi">

    <script src="http://dev.bokdukpan.com/resource/home/pc/js/common/jquery-1.9.1.min.js"></script>
</head>
<body>

<!-- start of :: wrap -->
<div id="wrap">
    <!-- start of :: header -->
   
숫자 : <input type="text" id="numberInput" name="numberInput"  value="" placeholder="" class="ipt"><br />
</div>
<!-- end of :: wrap-->

<script type="text/javascript">
(function($) {
$(function() {
$(document).on({'keydown' : function(evt) {
var charCode = (evt.which) ? evt.which : event.keyCode

if ($.inArray(charCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 // delete, backspace, tab, escape, enter, decimal point, period
|| (charCode == 65 && (evt.ctrlKey === true || evt.metaKey === true)) // Allow: Ctrl/cmd+A
|| (charCode == 67 && (evt.ctrlKey === true || evt.metaKey === true)) // Allow: Ctrl/cmd+C
      || (charCode == 86 && (evt.ctrlKey === true || evt.metaKey === true)) // Allow: Ctrl/cmd+V
      || (charCode == 88 && (evt.ctrlKey === true || evt.metaKey === true)) // Allow: Ctrl/cmd+X
      || (charCode >= 35 && charCode <= 39)) // Allow: home, end, left, right
      {
           return true;
  }

if ((charCode < 31 || (charCode >= 48 && charCode <= 57)))
            return true;
           
          return false;
}
,'paste' : function(evt) {
var inputRule = $(this).data('iwtInputRule');
var data = evt.originalEvent.clipboardData.getData('text/plain');

var reg = /^[0-9]+$/;
if(!reg.test(data)) {
evt.returnValue = false;
if(evt.preventDefault) evt.preventDefault();
}
}

,'keyup focusout' : function(evt) {
var inputVal = $(this).val();

$(this).val(inputVal.replace(/[^0-9]/g, ''));
var val = parseInt($(this).val()), max = $(this).attr('max'), min = $(this).attr('min');
if(!isNaN(val)) {
if(evt.type === 'focusout' && typeof min != 'undefined' && val < min) {
$(this).val(min)
}
else if(typeof max != 'undefined' && val > max) {
$(this).val(max)
}
}

var maxlength = $(this).attr('maxlength');
if(typeof maxlength != 'undefined' && $(this).val().length > maxlength) {
$(this).val($(this).val().substring(0, maxlength));
}
}
}, 'input');
  });
})(jQuery);
</script>

</body>
</html>

Posted by incree

2018/10/10 23:48 2018/10/10 23:48
Response
0 Trackbacks , 0 Comments
RSS :
http://www.incree.com/tc/incree/rss/response/397

Trackback URL : 이 글에는 트랙백을 보낼 수 없습니다


Notices

Archives

Authors

  1. incree

Recent Trackbacks

Calendar

«   2018/10   »
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      

Site Stats

Total hits:
508456
Today:
240
Yesterday:
319