提问人：Just Me 提问时间：9/4/2022 更新时间：9/5/2022 访问量：183
JQuery 键启动和使用 Ajax 提交验证
JQuery on key up and on submit validation with Ajax
问：
在提交表单之前，我需要首先验证用户在键入时输入的数据。假设我有一个这样的输入：
<input type="text" value="" name="title" class="input" id="title" placeholder="Job Title">
在我的脚本中，我需要验证用户在键入时的输入：
$("#title").on("keyup", function(e) {
if($(this).val() == "") {
$("#errorMsg").html('This field is required');
return false;
} else {
$("#errorMsg").html('');
return true;
}
});
成功验证输入后，用户现在可以提交表单，但是，如果输入未成功验证并且用户单击提交按钮，我需要收到一条错误消息，指出“首先修复您的错误”;
$('#save_btn').on('click', function(e){
e.preventDefault();
if ( user input is false ){
alert('Fix your errors first!');
} else{
alert('Validation Successful')
}
我不会在我的代码中包含ajax部分，因为它已经工作正常。我只需要这个提交验证来修复。我认为它与函数有关（？），但我不知道如何执行它。
答：
1赞
Reda EL FILLALI
9/4/2022
#1
或者你可以使用jquery验证插件 https://jqueryvalidation.org/documentation/
1赞
Mitali Patel
9/5/2022
#2
$('.demo-form').parsley();
$(".demo-form").on("submit", function (event) {
event.preventDefault();
$('.demo-form').parsley().validate();
if ($('.demo-form').parsley().isValid()) {
//ajxt code
}
}); .parsley-error {
border-color: #ef4554 !important;
}
.error {
border-color: #ef4554 !important;
color: #f6504d;
line-height: 1.2;
}
.parsley-errors-list {
display: none;
margin: 0;
padding: 0;
}
.parsley-errors-list.filled {
display: block;
}
.parsley-errors-list>li {
font-size: 12px;
list-style: none;
color: #f6504d;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/parsley.js/2.9.2/parsley.min.js"></script>
You can use parsly jquery valiation
<form class="demo-form" >
<div>
<label for="firstname">Firstname:</label><br>
<input type="text" class="form-control" name="firstname" data-parsley-required-message="Please enter firstname" required>
</div>
<div>
<label for="lastname">Lastname:</label><br>
<input type="text" class="form-control" name="lastname" data-parsley-required-message="Please enter last name" required>
</div>
<input type="submit" class="btn btn-default">
</form>评论
0赞
Just Me
9/6/2022
谢谢伙计！但是我想在 keyup 和提交时都验证它，它仍然可以解析吗？
0赞
Mitali Patel
9/6/2022
是的，这是可能的...... $（“.demo-form input”）.on（“keyup”， function （event） { $（'.demo-form'）.parsley（）.validate（）;
评论
$('#title').val() === ''