Question

我有这段代码可以验证html表单并突出显示带红色边框的空字段。

我想要的是能够返回空输入字段的名称值，以便我可以输出它们。

var isValid = $('input, textarea').not('input:disabled').filter(function() {

    return !this.value;

}).css('border-color', 'red').length == 0;

if(isValid){
    console.log('Ok');
}else if(!isValid){
    console.log($(this).attr('name') + 'must not be empty');
}

当没有空字段时，第一部分运行良好，但是当有空字段时，我希望在控制台中获取这些输入的名称值。但我一直在未定义

Answer 1

原因是isValid是布尔值（.length == 0）。你需要得到这样的过滤元素：

var isValidEl = $('input, textarea').not('input:disabled').filter(function() {

    return this.value.length == 0;

}).css('border-color', 'red');

然后，将条件更改为：

if(!isValidEl.length){
    console.log('Ok');
} else {
    isValidEl.each(function() {
        console.log($(this).attr('name') + ' must not be empty');
    });
}

〔实施例：

var isValidEl = $('input, textarea').not('input:disabled').filter(function() {

    return this.value.length == 0;

}).css('border-color', 'red');

if(!isValidEl.length){
    console.log('Ok');
} else {
    isValidEl.each(function() {
        console.log($(this).attr('name') + ' must not be empty');
    });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value="" name="emptyInput">
<textarea name="emptyTextaria"></textarea>
<textarea name="nonEmptyTextaria">HELLO</textarea>
<input type="text" value="HELLO" name="nonemptyInput">

Answer 2

可以使用map()

var isValid = $('input, textarea').not('input:disabled').filter(function() {    
    return !this.value;    
}).css('border-color', 'red')

var names = isvalid.map(function(){
    return this.name;
}).get()

如何在jQuery中返回空字段的名称值

2 个答案: