0

我的 html 页面中有以下文本框。

我目前使用的代码是 .

<input type="text" id = "points" onkeyup="Validate()">
function Validate(){


var text_value = document.getElementById("points").value;
alert(text_value);

   if (!text_value.match(/^[56789]$/) && document.getElementById(called_id).value !="")
    {
       document.getElementById("points").value="";
       //  document.getElementById("points").focus(); 
       alert("Please Enter only between 5 and 10 ");
    }

}     

可接受的值为 5 、 6 、 7 、 8 、 9 和 10 。我找到了基于 onkeyup 事件的方法,只接受 5、6、7、8 和 9 .. 我想知道如何在其中包含 10。我也想知道使用 jquery 的 onkeyup 事件验证。

  1. 如果用户提供除这些之外的任何其他值,则应在文本框的右侧给出“该值应在 5 到 10 之间”(不作为警报)。
  2. 如果第一个输入的值是 1,它应该等待下一个按键被按下。如果它是 0 则接受或引发与前一种情况相同的错误消息。
4

3 回答 3

1

Working Jsfiddle

I would prefer without regex:

function validate() {
    var num = document.getElementById("points2").value;
    var num = parseInt(num, 10);
    alert(num);
    if (num < 5 || num > 10) {
        document.getElementById("points2").value = "";
        alert("Please Enter only between 5 and 10 ");
    }
}

change your regex to :

/^([5-9]|10)$/

you should use onchange event:

<input type="text" id = "points"  onchange="Validate()">

function Validate(){    
var text_value = document.getElementById("points").value;
alert(text_value);

   if (!text_value.match(/^([5-9]|10)$/) && document.getElementById(called_id).value !="")
    {
       document.getElementById("points").value="";
       //  document.getElementById("points").focus(); 
       alert("Please Enter only between 5 and 10 ");
    }

}  
于 2013-07-19T07:12:51.757 回答
0
$('#textbox').keyup(function() {
    var value = $('#textbox').val();
    if(value != ''){
        if(!value.match(/^[5678910]$/))  
            textboxError();
        else{
            var length = value.length;
            if(value.charAt(length-1) == 0 && value.charAt(length-2) != 1)
                textboxError();
        }
    }
};

$('#textbox').change(function() {
    var value = $('#textbox').val();
    if(value != '')
        textboxError();
    }
};

function textboxError(){
    $('#textbox').val(''); 
    $('#textbox').focus(); 
    alert("Please Enter only between 5 and 10 ");
}

我们正在做的是,

  1. 检查值是否为空(如果为空不执行任何操作)
  2. 如果不为空,则检查值是否与定义的集合匹配
  3. 如果匹配,现在我们检查 10。我们所做的是,如果最后输入的字段项是 0,那么前一个字段必须是 1,所以它是 10。如果不是,我们会抛出错误。
  4. 但这里有一个问题,用户可能输入 1 并离开该字段而不输入另一个字符。所以,你可以通过 onchange 字段来扩展它。
  5. Onchange,现在我们检查计数 1 并且应该匹配计数 10。它解决了我们的问题。您不必担心 0,因为我们已经在 keyup 块中检查了它。

我没有检查代码。因此,如果有任何拼写错误或错误,您可以替换它们。

于 2013-07-19T07:51:00.943 回答
0

正如 Zaheer Ahmed 所说,/^([5-9]|10)$/也将捕获 10 个。对于事件侦听器,您可以使用

$('#textbox')[0].addEventListener('input', function(event) {
  var value = $(event.target).val();  
  // we already have a reference to the element through the event object,
  // crawling the DOM again is expensive.

  if(value != '') textboxError();
});

这绕过了 jQuery,有些人可能对此不满意,但 'input' 事件会立即触发,并且如果文本是通过其他方法粘贴或输入的,它也会起作用。

于 2016-02-15T04:42:49.453 回答