jquery plugin để ngăn chặn nhập bất kỳ đầu vào nào không khớp với regexp

Question

jquery có bất kỳ plugin nào ngăn cản nhập bất kỳ đầu vào nào vào hộp văn bản không khớp với mẫu regexp hay không. Ví dụ, tôi có một hộp văn bản để nhập số tiền thanh toán, tôi muốn người dùng t có thể nhập chỉ số và. trong hộp văn bản, tất cả các đầu vào khác sẽ không có bất kỳ ảnh hưởng đến textbox ..

nhờ

Answer 1

jquery-keyfilter plugin - thực hiện những gì cần thiết.

Answer 2

Masked Input Plugin

jQuery(function($){ 
    $("#paymentAmount").mask("9999.99"); 
}); 

Answer 3

Keyboard sự kiện được một chút khôn lanh như đề xuất trên các tài liệu jQuery.
http://unixpapa.com/js/key.html
http://yehudakatz.com/2007/07/03/event-normalization-in-jquery-113/

Khó khăn mà bạn quan tâm là thế này:

Xác định Phím
Khi bạn bắt một sự kiện bàn phím, bạn có thể muốn biết đó chính là ép. Nếu có, bạn có thể hỏi quá nhiều. Đây là một mớ hỗn độn rất lớn về trình duyệt không tương thích và lỗi.
Từ mắt xích đầu tiên trên

Dầu sao đi nữa, trong jQuery Tôi muốn làm điều này:

textBoxElement.keydown(function(e) { 
    var chr = String.fromCharCode(e.which); 
    if(!/[0-9.]/.test(chr)) { 
     e.preventDefault(); 
    } 
} 

này cũng sẽ vô hiệu hóa các phím quan trọng khác như nhập, tab, xóa, vì vậy họ cần được thêm vào điều kiện. Không phải tất cả các phím khác đều có thể in được và do đó không thể được regexed, vì vậy bạn sẽ phải kiểm tra e.keyCode của chúng. 13, 8 vv

Nếu bạn không quá bận tâm về regex bạn có thể làm một cái gì đó giống như

textBoxElement.keydown(function(e) { 
    switch(e.keyCode) { 
     case 48: //0 
     case 49: //1 
     case 50: //2 
     case 51: //3 
     case 52: //4 
     case 53: //5 
     case 54: //6 
     case 55: //7 
     case 56: //8 
     case 57: //9 
     case 48: //10 
     case 37: //left 
     case 39: //right 
     case 8: //tab 
     case 13: //return 
     case 46: //del 
     case 190: //. 
      return; 
    } 
    e.preventDefault(); 
}); 

Answer 4

Tôi không nghĩ có bất kỳ plugin nào đó có sẵn. Vấn đề là một chút khó khăn, bởi vì bạn phải cho phép người dùng gõ một số đầu vào trước khi áp dụng regex của bạn. Đó là, bạn không thể chỉ phù hợp với mỗi char khi nó được gõ, trừ khi regex của bạn chỉ định nghĩa một tập hợp các ký tự.

Để minh họa, nếu họ nhập số tiền thanh toán và bạn muốn cho phép số và số thập phân trên cơ sở một ký tự, điều gì ngăn chúng nhập 99.99.23.42492?

Mặt khác, nếu bạn cung cấp một regex hoàn chỉnh như /\d+\.\d{2}/, thì nó sẽ không khớp với một ký tự, bạn sẽ phải cho phép chúng nhập một số ký tự trước khi thử áp dụng regex và xóa đầu vào của họ nếu nó không khớp. Điều đó có thể gây phiền toái.

Nếu bạn thực sự muốn lọc đầu vào khi nhập, thì bạn muốn cho phép chữ số cho ký tự đầu tiên, sau đó nhập chữ số hoặc số thập phân cho ký tự tiếp theo cho đến khi nhập số thập phân. không có thêm đầu vào. Nó không phải là một bộ lọc đa năng.

Ví dụ: đây là một số mã sẽ thực hiện điều đó nhưng rất xấu.

myInput.keydown(function() { 
     var text = this.val 
     if(!/^\d/.test(text)) { 
      return ''; 
     } else { 
      done = text.match(/^(\d+\.\d\d)/); 
      if (done) { return done[0]; } 

      last_char = text.substr(text.length-1,1); 
      decimal_count = text.replace(/[^\.]/g,'').length; 

      if (decimal_count < 1) { 
      if (!/[\d\.]/.test(last_char)) { 
       return text.substr(0,text.length-1); 
      } 
      } else if (decimal_count == 1 && last_char == '.') { 
      return text; 
      } else { 
      if (!/[\d]/.test(last_char)) { 
       return text.substr(0,text.length-1); 
      } 
      } 
      return text; 
     } 
    }); 

Và tất nhiên, điều này sẽ không hoạt động nếu chúng xảy ra khi dán vào các giá trị nhất định mà không thực hiện nhập "thực".

Có thể một số cách tiếp cận khác sẽ hoạt động tốt hơn cho bạn?Giống như làm nổi bật trường và chỉ ra cho người dùng nếu họ nhập một chữ số, không thập phân hoặc nếu họ nhập nhiều hơn một chữ số thập phân, thay vì lọc đầu vào, vì điều đó có vẻ lộn xộn.

Answer 5

Đây là một phần mở rộng jquery đơn giản tôi sử dụng:

jQuery.fn.DecimalMask = function() { 
    return this.each(function() { 
    $(this).keypress(function (e) { 
     var keynum; 
     if (window.event) // IE 
     { 
     keynum = e.keyCode; 
     } 
     else if (e.which) // Netscape/Firefox/Opera 
     { 
     keynum = e.which; 
     } 
     if (typeof keynum == 'undefined') return true; 
     else if (keynum == 46 && $(this).val().indexOf(".") > -1) return false; //already has a decimal point 
     else return ((keynum > 47 && keynum < 58) || keynum == 13 || keynum == 8 || keynum == 9 || keynum == 46 || keynum == 45); //allow ony number keys or keypad number keys 
    }); 
    }); 
}; 
//implementation 
$("#mytxtbox").DecimalMask();