使用 jQuery 检查是否需要输入字段
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18495310/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Checking if an input field is required using jQuery
提问by Tristan Cunningham
What would be the easiest way to check if an input is required? I have been trying stuff along these lines but always comes up with all required (only 4/6 are).
检查是否需要输入的最简单方法是什么？我一直在尝试这些方面的东西，但总是想出所有需要的东西（只有 4/6 是）。
$('form#register').find('input').each(function(){
if($(this).prop('required') == 'undefined'){
console.log("NR");
} else {
console.log("IR");
}
})
(I have tried .attr aswell)
（我也试过 .attr ）
Im trying to use it for form ajax validation, Im doing it this way at the moment:
我正在尝试将它用于表单 ajax 验证，我目前正在这样做：
if($('form#register span').length == $('form#register').children(".green").length){
$('input#register-sub').prop('disabled', false);
} else {
$('input#register-sub').prop('disabled', true);
}
Thanks.
谢谢。
EDIT: Html adding
编辑：Html 添加
<form id="register" action="" method="post" autocomplete="on">
<label>Nickname:</label><input type="text" name="name" value="<? echo $_POST['name'] ?>" required="" /><span id="reg-name"></span><br />
<? if($user->type == "l"){ ?>
<label>email:</label><input type="email" name="email" value="<? echo $_POST['email'] ?>" required="" /><span id="reg-email"></span><br />
<label>Password:</label><input type="password" name="password" value="<? echo $_POST['password'] ?>" required="" /><span id="reg-password"></span><br />
<label>Again:</label><input type="password" name="password-test" value="<? echo $_POST['password-test'] ?>" required="" /><span id="reg-password-test"></span><br />
<label>Avatar:</label><input type="url" name="avatar" value="<? echo $_POST['avatar'] ?>" /><span id="reg-avatar"></span><br />
<? } ?>
<input type="submit" value="Register" disabled="" id="register-sub"/>
回答by rink.attendant.6
The requiredproperty is boolean:
该required物业是boolean：
$('form#register').find('input').each(function(){
if(!$(this).prop('required')){
console.log("NR");
} else {
console.log("IR");
}
});
Reference: HTMLInputElement
参考： HTMLInputElement
回答by JPollock
A little bit of a more complete answer, inspired by the accepted answer:
一个更完整的答案，灵感来自接受的答案：
$( '#form_id' ).submit( function( event ) {
event.preventDefault();
//validate fields
var fail = false;
var fail_log = '';
var name;
$( '#form_id' ).find( 'select, textarea, input' ).each(function(){
if( ! $( this ).prop( 'required' )){
} else {
if ( ! $( this ).val() ) {
fail = true;
name = $( this ).attr( 'name' );
fail_log += name + " is required \n";
}
}
});
//submit if fail never got set to true
if ( ! fail ) {
//process form here.
} else {
alert( fail_log );
}
});
In this case we loop all types of inputs and if they are required, we check if they have a value, and if not, a notice that they are required is added to the alert that will run.
在这种情况下，我们循环所有类型的输入，如果需要它们，我们检查它们是否有值，如果没有，则将需要它们的通知添加到将运行的警报中。
Note that this, example assumes the form will be proceed inside the positive conditional via AJAX or similar. If you are submitting via traditional methods, move the second line, event.preventDefault();to inside the negative conditional.
请注意，此示例假定表单将通过 AJAX 或类似方式在肯定条件下进行。如果您通过传统方法提交，请将第二行移到event.preventDefault();否定条件内。
回答by Kris Selbekk
You don't need jQuery to do this. Here's an ES2015 solution:
您不需要 jQuery 来执行此操作。这是一个 ES2015 解决方案：
// Get all input fields
const inputs = document.querySelectorAll('#register input');
// Get only the required ones
const requiredFields = Array.from(inputs).filter(input => input.required);
// Do your stuff with the required fields
requiredFields.forEach(field => /* do what you want */);
Or you could just use the :requiredselector:
或者你可以只使用:required选择器：
Array.from(document.querySelectorAll('#register input:required'))
.forEach(field => /* do what you want */);
回答by Aamir Nakhwa
$('form#register input[required]')
It will only return inputs which have required attribute.
它只会返回具有 required 属性的输入。
