Question

我在JavasCript.Works中只有一个输入数字中有一个数字验证，但我需要一些输入的验证，我试图用jquery选择器类做这个，但它只验证其中一个。我怎么能这样做？

HTML：

<input id="dsa" type="number" class="css" min="0" max="10" />
<input id="dsa1" type="number" class="css" min="0" max="10" />
<input id="dsa2" type="number" class="css" min="0" max="10" />

JAVASCRIPT / Jquery的

var input = document.querySelector('.css');
input.onkeyup = function testNums(evt) { 
var num = parseInt(evt.target.value, 10);

 if(typeof num === "number" && num < 11 && num > -1){
   evt.target.value = num
 }

 else{
  evt.target.value = ''
 }  


};

http://jsfiddle.net/NL43y/

提前致谢。

Answer 1

要选择多个元素，请使用querySelectorAll - 然后您必须循环并绑定每个元素，或使用jQuery（标记为）

$(".css").keyup(function(evt) {
    //code
});

或循环（http://jsfiddle.net/NL43y/1/）

var input = document.querySelectorAll('.css');
for (var i = 0; i < input.length; i++) {
    input[i].onkeyup = function testNums(evt) { 
        var num = parseInt(evt.target.value, 10);
        if(typeof num === "number" && num < 11 && num > -1){
            evt.target.value = num
        } else {
            evt.target.value = ''
        }  
    };
}

Answer 2

您可以执行此操作：http://jsfiddle.net/Fa38e/

jspref只是为了好玩：http://jsperf.com/getelementbyid-vs-jquery-id/72

休息希望它符合您的需求:)

<强>码

var input = $('.css');
input.keyup(function(evt) { 
     var num = parseInt(evt.target.value, 10);
    if(typeof num === "number" && num < 11 && num > -1){
        evt.target.value = num
    } else {
        evt.target.value = ''
    }
});

Answer 3

您只在一个元素querySelector上调用它只返回一个元素，您想要的是querySelectorAll。这是一个没有jQuery（http://jsfiddle.net/NL43y/2/）

的例子

var inputs = Array.prototype.slice.call(document.querySelectorAll('.css'));

inputs.forEach(function (input) {
    input.onkeyup = function testNums(evt) { 
        var num = parseInt(evt.target.value, 10);
        if(typeof num === "number" && num < 11 && num > -1){
            evt.target.value = num;
        } else {
            evt.target.value = '';
        }  
    };
});

但如果您使用jQuery，则可以执行此操作（http://jsfiddle.net/NL43y/3/）

$('.css').keyup(function(event) { 
    var num = parseInt(event.target.value, 10);

    if(typeof num === "number" && num < 11 && num > -1){
        event.target.value = num;
    } else {
        event.target.value = '';
    }
});

查询选择器类在数字验证中不起作用

3 个答案: