Question

我正在验证空文本字段和选择标记。我正在尝试使用JQuery在表单提交时显示一个警告框，其中包含所有空字段名称（逗号分隔）。以下是我的代码：

Jquery脚本：

$('#save').click(function(){
    var invalidFields = $('#startdate, #enddate').map(function (i, element) {
        if (element.value == '') {
        return this.id;
        }
    }).get();
alert('Following fields are empty: ' + invalidFields.join(', '));
return false;
});
return true;

HTML：

<form id="formname">
    <input class="inputbox" id="startdate" name="change_request.start_date" type="text" />
    <input class="inputbox" id="enddate" name="change_request.end_date" type="text" />
    <input class="submitbutton" id="save" type="button" value="Save">
</form>

警报应该显示如下：

'以下必填字段未填入'：startdate，enddate

这是修订后的代码，当前正在运行，但即使条件为真，也会使用警告框进行循环。

Answer 1

将此代码放在提交处理函数

中

var invalidFields = new Array();
$('#formname input[type=text]').filter(function (i, element) {
    if (this.value == '') {
        invalidFields.push(this.id);
    }
});
alert(invalidFields.join(', ') + ' are empty');

或者，

最简单，

var invalidFields = $('#formname input[type=text]').map(function (i, element) {
    if (element.value == '') {
        return this.id;
    }
}).get();
alert(invalidFields.join(', ') + ' are empty');

Answer 2

试试这个

Fiddle

$(document).ready(function () {
    var invalidFields = new Array();
    var theText = invalidFields.join(', ');
    $('#save').click(function () {
        $('#formname input[type=text]').each(function (n, element) {
            if ($(element).val() == '') {
                theText += '' + $(element).attr('id') + ', ';
            }
        });
        alert("folowing field are empty - " + theText);
        return false
    });
    return true;
});

使用jquery在警告框中显示逗号分隔的字段名称

2 个答案: