jquery - 选择器的 if 条件中指定的 id

Question

我有以下代码

if($('#contact_name').val()==''){
$('#contact_name').closest('div').append('<p class="validate">name must be entered</p>');
error=true;
}
if($('#contact_add').val()==''){
$('#contact_add').closest('div').append('<p class="validate">address must be entered</p>');
error=true;
}
if($('#contact_mail').val()==''){
$('#contact_mail').closest('div').append('<p class="validate">mail must be entered</p>');
error=true;
}
if($('#contact_ph').val()==''){
$('#contact_ph').closest('div').append('<p class="validate">type your phone number</p>');
error=true;
}

每次选择器 $('#contact_name'), $('#contact_add'),.... 时，我都必须更改它。无论如何，如果条件是 id 是什么，我可以选择它.....

我确定我不能使用 $(this).....

Answer 1

试试这个，使用 jQuery 选择器“以”开头：

$('*[id^="contact_"]').each(function () {
    if (this.value == '') {
        $(this).closest('div').append('<p class="validate">some text</p>');
        error = true;
    })
};

我曾经*以所有元素为目标，您可以将其替换为div,p或更适合您的元素的内容。

Answer 2

您可以使用each()和多项选择：

$('#contact_name, #contact_add').each(function(){
    if (this.value == '') {
        $(this).closest('div').append('<p class="validate">some text</p>');
    }
});

或者，filter()用于选择那些input没有值的 s：

$('div[id^="contact"]').filter(function(){
    return this.value == '';
}).closest('div').append('<p class="validate">some text</p>');

使用后一种方法，您甚至可以分配error变量（如果需要）：

var error = $('div[id^="contact"]').filter(function(){
        return this.value == '';
    }).closest('div').append('<p class="validate">some text</p>').length > 0;

参考：

• each().
• filter().

Answer 3

在您的代码中使用如下：

$(document).ready(function(){
    $("#ttt").submit( function(){
        if($('#contact_name').val()==''){
        $('#contact_name').closest('div').append('<p class="validate">some text</p>');
        error=true;
        }
        if($('#contact_add').val()==''){
        $('#contact_add').closest('div').append('<p class="validate">some text</p>');
        error=true;
        }
        if($('#contact_mail').val()==''){
        $('#contact_mail').closest('div').append('<p class="validate">some text</p>');
        error=true;
        }
        if($('#contact_ph').val()==''){
        $('#contact_ph').closest('div').append('<p class="validate">some text</p>');
        error=true;
        }
        return false;
    });
});

Answer 4

我猜 id 是 form(input) 元素。如果是这种情况，您可以像这样遍历输入元素：

$('[id^="contact_"]').each(function () {
    if (this.value == '') {
        $(this).closest('div').append('<p class="validate">some text</p>');
        error = true;
    })
};

Answer 5

required像这样向所需的元素添加一个类

var error = $('.required').filter(function () {
    return $.trim($(this).val()) == '';
}).closest('div').append('<p class="validate">some text</p>').length > 0;