Ответ 1
Вместо этого:
onkeypress="return fun_AllowOnlyAmountAndDot(this);"
Вы должны использовать это:
onkeypress="return fun_AllowOnlyAmountAndDot(this.id);"
Я использую этот javascript для ограничения пользователей на ввод только чисел и только одну точку в качестве разделителя с разделителями.
<script type="text/javascript">
function fun_AllowOnlyAmountAndDot(txt)
{
if(event.keyCode > 47 && event.keyCode < 58 || event.keyCode == 46)
{
var txtbx=document.getElementById(txt);
var amount = document.getElementById(txt).value;
var present=0;
var count=0;
if(amount.indexOf(".",present)||amount.indexOf(".",present+1));
{
// alert('0');
}
/*if(amount.length==2)
{
if(event.keyCode != 46)
return false;
}*/
do
{
present=amount.indexOf(".",present);
if(present!=-1)
{
count++;
present++;
}
}
while(present!=-1);
if(present==-1 && amount.length==0 && event.keyCode == 46)
{
event.keyCode=0;
//alert("Wrong position of decimal point not allowed !!");
return false;
}
if(count>=1 && event.keyCode == 46)
{
event.keyCode=0;
//alert("Only one decimal point is allowed !!");
return false;
}
if(count==1)
{
var lastdigits=amount.substring(amount.indexOf(".")+1,amount.length);
if(lastdigits.length>=2)
{
//alert("Two decimal places only allowed");
event.keyCode=0;
return false;
}
}
return true;
}
else
{
event.keyCode=0;
//alert("Only Numbers with dot allowed !!");
return false;
}
}
</script>
<td align="right">
<asp:TextBox ID="txtQ1gTarget" runat="server" Width="30px" CssClass="txtbx" MaxLength="6" onkeypress="return fun_AllowOnlyAmountAndDot(this);"></asp:TextBox>
</td>
Но событие onkeypress (this) возвращает требуемую объектную ошибку в этой функции в этом месте
var amount = document.getElementById(txt).value;
Какая моя ошибка здесь?
Вместо этого:
onkeypress="return fun_AllowOnlyAmountAndDot(this);"
Вы должны использовать это:
onkeypress="return fun_AllowOnlyAmountAndDot(this.id);"
Это отличное место для использования регулярных выражений.
Используя регулярное выражение, , вы можете заменить весь этот код только одной строкой.
Вы можете использовать следующее регулярное выражение для проверки ваших требований:
[0-9]*\.?[0-9]*
Другими словами: ноль или несколько числовых символов, за которыми следуют ноль или один период (ы), за которым следуют ноль или более числовых символов.
Вы можете заменить свой код следующим:
function validate(s) {
var rgx = /^[0-9]*\.?[0-9]*$/;
return s.match(rgx);
}
Этот код может заменить всю вашу функцию!
Обратите внимание, что вам нужно избежать периода с помощью обратного слэша (в противном случае это означает "любой символ" ).
Чтобы узнать больше об использовании регулярных выражений с помощью javascript, выполните следующие действия:
Здесь вы также можете проверить приведенное выше выражение:
Объяснение регулярного выражения, используемого выше:
Скобки означают "любой символ внутри этих скобок". Вы можете использовать дефис (например, выше), чтобы указать диапазон символов.
*
означает "ноль или более предыдущего выражения".
[0-9]*
означает "ноль или больше чисел"
Обратная косая черта используется как escape-символ для периода, потому что период обычно означает "любой символ".
?
означает "ноль или один из предыдущего символа".
^
представляет начало строки.
$
представляет конец строки.
Запуск регулярного выражения с ^
и завершение его $
гарантирует, что вся строка будет придерживаться шаблона регулярного выражения.
Надеюсь, это поможет!
Вместо этого используйте JQuery. Добавьте десятичный класс в текстовое поле:
<input type="text" class="decimal" value="" />
Используйте этот код в своем JS. Он проверяет наличие нескольких десятичных знаков, а также ограничивает пользователей типом только чисел.
$('.decimal').keyup(function(){
var val = $(this).val();
if(isNaN(val)){
val = val.replace(/[^0-9\.]/g,'');
if(val.split('.').length>2)
val =val.replace(/\.+$/,"");
}
$(this).val(val);
});
Проверьте эту скрипту: http://jsfiddle.net/2YW8g/
Надеюсь, что это поможет.
function isNumberKey(evt,id)
{
try{
var charCode = (evt.which) ? evt.which : event.keyCode;
if(charCode==46){
var txt=document.getElementById(id).value;
if(!(txt.indexOf(".") > -1)){
return true;
}
}
if (charCode > 31 && (charCode < 48 || charCode > 57) )
return false;
return true;
}catch(w){
alert(w);
}
}
<html>
<head>
</head>
<body>
<INPUT id="txtChar" onkeypress="return isNumberKey(event,this.id)" type="text" name="txtChar">
</body>
</html>
Просто добавьте код в свой текст:
onkeypress='return event.charCode == 46 || (event.charCode >= 48 && event.charCode <= 57)'
<input type="text" class="decimal" value="" />
$('.decimal').keypress(function(evt){
return (/^[0-9]*\.?[0-9]*$/).test($(this).val()+evt.key);
});
Я думаю, что это простое решение может быть.
Это работает лучше всего для меня.
Я также применяю форматировщик валют при размытии, где десятичная часть округляется на 2 цифры на всякий случай после проверки с помощью parseFloat.
Функции, которые получают и устанавливают позицию курсора, принадлежат блогу Vishal Monpara. Я также хорошо разбираюсь в этих функциях. Вы можете легко удалить 2 блока кода, где 2 десятичных значения принудительно, если вы хотите, и избавиться от функций set/get caret.
<html>
<body>
<input type="text" size="30" maxlength="30" onkeypress="return numericValidation(this,event);" />
<script language="JavaScript">
function numericValidation(obj,evt) {
var e = event || evt; // for trans-browser compatibility
var charCode = e.which || e.keyCode;
if (charCode == 46) { //one dot
if (obj.value.indexOf(".") > -1)
return false;
else {
//---if the dot is positioned in the middle give the user a surprise, remember: just 2 decimals allowed
var idx = doGetCaretPosition(obj);
var part1 = obj.value.substr(0,idx),
part2 = obj.value.substring(idx);
if (part2.length > 2) {
obj.value = part1 + "." + part2.substr(0,2);
setCaretPosition(obj, idx + 1);
return false;
}//---
//allow one dot if not cheating
return true;
}
}
else if (charCode > 31 && (charCode < 48 || charCode > 57)) { //just numbers
return false;
}
//---just 2 decimals stubborn!
var arr = obj.value.split(".") , pos = doGetCaretPosition(obj);
if (arr.length == 2 && pos > arr[0].length && arr[1].length == 2)
return false;
//---
//ok it a number
return true;
}
function doGetCaretPosition (ctrl) {
var CaretPos = 0; // IE Support
if (document.selection) {
ctrl.focus ();
var Sel = document.selection.createRange ();
Sel.moveStart ('character', -ctrl.value.length);
CaretPos = Sel.text.length;
}
// Firefox support
else if (ctrl.selectionStart || ctrl.selectionStart == '0')
CaretPos = ctrl.selectionStart;
return (CaretPos);
}
function setCaretPosition(ctrl, pos){
if(ctrl.setSelectionRange)
{
ctrl.focus();
ctrl.setSelectionRange(pos,pos);
}
else if (ctrl.createTextRange) {
var range = ctrl.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
}
</script>
</body>
</html>
<script type="text/javascript">
function numericValidation(txtvalue) {
var e = event || evt; // for trans-browser compatibility
var charCode = e.which || e.keyCode;
if (!(document.getElementById(txtvalue.id).value))
{
if (charCode > 31 && (charCode < 48 || charCode > 57))
return false;
return true;
}
else {
var val = document.getElementById(txtvalue.id).value;
if(charCode==46 || (charCode > 31 && (charCode > 47 && charCode < 58)) )
{
var points = 0;
points = val.indexOf(".", points);
if (points >= 1 && charCode == 46)
{
return false;
}
if (points == 1)
{
var lastdigits = val.substring(val.indexOf(".") + 1, val.length);
if (lastdigits.length >= 2)
{
alert("Two decimal places only allowed");
return false;
}
}
return true;
}
else {
alert("Only Numarics allowed");
return false;
}
}
}
</script>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtHDLLevel" MaxLength="6" runat="server" Width="33px" onkeypress="return numericValidation(this);" />
</div>
</form>
function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 46 || charCode > 57)) {
return false;
}
return true;
}
вы должны использовать эту функцию и написать свойства этого элемента;
Код HTML:
<input id="deneme" data-mini="true" onKeyPress="return isNumber(event)" type="text"/>`
попробуйте этот код
var check = function(evt){
var data = document.getElementById('num').value;
if((evt.charCode>= 48 && evt.charCode <= 57) || evt.charCode== 46 ||evt.charCode == 0){
if(data.indexOf('.') > -1){
if(evt.charCode== 46)
evt.preventDefault();
}
}else
evt.preventDefault();
};
document.getElementById('num').addEventListener('keypress',check);
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<input type="text" id="num" value="" />
</body>
</html>
Попробуйте это для нескольких текстовых полей (с помощью селектора классов):
var checking = function(event){
var data = this.value;
if((event.charCode>= 48 && event.charCode <= 57) || event.charCode== 46 ||event.charCode == 0){
if(data.indexOf('.') > -1){
if(event.charCode== 46)
event.preventDefault();
}
}else
event.preventDefault();
};
function addListener(list){
for(var i=0;i<list.length;i++){
list[i].addEventListener('keypress',checking);
}
}
var classList = document.getElementsByClassName('number');
addListener(classList);
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<input type="text" class="number" value="" /><br><br>
<input type="text" class="number" value="" /><br><br>
<input type="text" class="number" value="" /><br><br>
<input type="text" class="number" value="" /><br><br>
</body>
</html>
Эта функция предотвратит ввод чего-либо, кроме цифр и одной точки.
function validateQty(el, evt) {
var charCode = (evt.which) ? evt.which : event.keyCode
if (charCode != 45 && charCode != 8 && (charCode != 46) && (charCode < 48 || charCode > 57))
return false;
if (charCode == 46) {
if ((el.value) && (el.value.indexOf('.') >= 0))
return false;
else
return true;
}
return true;
var charCode = (evt.which) ? evt.which : event.keyCode;
var number = evt.value.split('.');
if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
return false;
}
};
<input type="text" onkeypress='return validateQty(this,event);'>
Вы можете использовать это
Javascript
function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 48 || charCode > 57)&&(charCode!=46)) {
return false;
}
return true;
}
Usage
Usage <input onkeypress="return isNumber(event)" class="form-control">
<script type="text/Javascript">
function checkDecimal(inputVal) {
var ex = /^[0-9]+\.?[0-9]*$/;
if (ex.test(inputVal.value) == false) {
inputVal.value = inputVal.value.substring(0, inputVal.value.length - 1);
}
}
</script>
<input type="text" class="form-control" id="odometer_reading" name="odometer_reading" placeholder="Odometer Reading" onblur="odometer_reading1();" onkeypress='validate(event)' required="" />
<script>
function validate(evt) {
var theEvent = evt || window.event;
var key = theEvent.keyCode || theEvent.which;
key = String.fromCharCode( key );
var regex = /[0-9]|\./;
if( !regex.test(key) ) {
theEvent.returnValue = false;
if(theEvent.preventDefault) theEvent.preventDefault();
}
}
</script>