我用HTML和PHP编写了一个简单的页面。因此，在PHP之前，我想使用Jquery检查空字段，但是我还不学习Jquery，所以如果有人帮助我，我将不胜感激。
<?php
if(isset($_POST[add]))
{
if(empty($_POST[name]) || empty($_POST[surname])) {echo 'All form fields are required';}
}
?>
<form action="" method=post>
<table border=0 cellspacing=10 cellpadding=5>
<tr>
<td>Name:</td>
<td><input type="text" name="name" size="10" value=""></td>
</tr>
<tr>
<td>Surname:</td>
<td><input type="text" name="surname" size="10" value=""></td>
</tr>
<tr>
<td colspan=2><input type="submit" name="add" value="Add"></td>
</tr>
</table>
</form>
您可以通过添加jquery添加验证。
$('input[name="add"]').click(function() {
if($('input[name="name"]').val() == '' || $('input[name="surname"]').val() == '') {
$('.error').html('');
if($('input[name="name"]').val() == '') {
$('.error').append('<p>Please enter your name</p>');
}
if ($('input[name="surname"]').val() == '') {
$('.error').append('<p>Please enter your surname</p>');
}
$('.error').show();
return false;
}
return true;
})
html代码
<div class="error" style="display:none"></div>
<form action="" method=post>
<table border=0 cellspacing=10 cellpadding=5>
<tr>
<td>Name:</td>
<td><input type="text" name="name" size="10" value=""></td>
</tr>
<tr>
<td>Surname:</td>
<td><input type="text" name="surname" size="10" value=""</td>
</tr>
<tr>
<td colspan=2><input type="submit" name="add" value="Add"></td>
</tr>
</table>
</form>
在提交时添加一个javascript函数，让我们说validate（）并在其中添加此jquery代码
function validate() {
var name = $("#name").val();
if (name == "") {
alert('Name is required');
return false;
}
}
<input class="field-name" type="text" name="name" size="10" value="">
我在此输入字段中添加了一个类，以便可以使用jQuery选择器
var name = $('.field-name').val();
if(name="") {
console.log('name is empty');
//your code here to do something when the field is empty
}
以下代码可以给您一些想法。我建议在[
阅读有关jquery的教程http://www.w3schools.com/jquery/default.asp
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
</head>
<script>
$(document).ready(function(){
$("#add").submit(function(){
if ($('#name').length == ""){
alert("ERROR in name!");
}
});
});
</script>
<form action="" method=post>
<table border=0 cellspacing=10 cellpadding=5>
<tr>
<td>Name:</td>
<td><input type="text" name="name" id="name" size="10" value=""></td>
</tr>
<tr>
<td>Surname:</td>
<td><input type="text" name="surname" id="surname" size="10" value=""</td>
</tr>
<tr>
<td colspan=2><input type="submit" name="add" id="add" value="Add"></td>
</tr>
</table>
</form>
</html>