【发布时间】：2015-03-02 08:25:19
【问题描述】：
我有以下表单，它使用 jQuery 验证表单并在所有字段填写正确时提交。到目前为止，一切正常。但我想添加以下内容，但不知道如何添加（因为我是 jQuery 新手）。
- 文本框（如名字和姓氏）不应接受任何数字。
如何将这些添加到我的代码中？请帮忙。
这是我的代码。
<?php
include'includes/db.php';
if(isset($_POST['submit']))
{
$fname =(!empty($_POST['firstname']))?$_POST['firstname']:null;
$lname =(!empty($_POST['lastname']))?$_POST['lastname']:null;
$email =(!empty($_POST['email']))?$_POST['email']:null;
$mobile =(!empty($_POST['mobile']))?$_POST['mobile']:null;
$dob =(!empty($_POST['dob']))?$_POST['dob']:null;
$location =(!empty($_POST['location']))?$_POST['location']:null;
$state =(!empty($_POST['state']))?$_POST['state']:null;
$gender =(!empty($_POST['gender']))?$_POST['gender']:null;
$str = "INSERT INTO members(mem_fname, mem_lname, mem_email, mem_mobile, mem_dob, mem_location, mem_state, mem_gender)VALUES('$fname', '$lname', '$email', '$mobile', '$dob', '$location', '$state', '$gender')";
$sql = mysql_query($str);
if($sql){
echo "Data Inserted Successfully";
}else{
echo "Data insertion failed";
}
}
?>
<!DOCTYPE>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$(function() {
$( ".datepicker" ).datepicker({
changeMonth: true,
changeYear: true
});
$("#register-form").validate({
rules: {
firstname: "required",
lastname: "required",
email: {
required: true,
email: true
},
mobile: {
required: true,
minlength: 10,
},
dob: "required",
location: "required",
state: "required",
gender: "required",
agree: "required"
},
messages: {
firstname: "Please enter your first name",
lastname: "Please enter your last name",
mobile: {
required: "Please provide your mobile number",
minlength: "Your mobile number must be 10 characters long"
},
email: "Please enter a valid email address",
dob: "Please provide you Date of Birth",
location: "Please provide your location",
state: "Please provide your state",
gender: "Please provide your gender",
agree: "Please accept our terms of service"
},
submitHandler: function(form) {
form.submit();
}
});
});
</script>
</head>
<body>
<br />
<br />
<form action="" method="post" id="register-form" novalidate="novalidate">
<div class="label">First Name</div>
<input type="text" id="firstname" name="firstname" />
<br />
<div class="label">Last Name</div>
<input type="text" id="lastname" name="lastname" />
<br />
<div class="label">Email</div>
<input type="email" id="email" name="email" />
<br />
<div class="label">Mobile</div>
<input type="number" name="mobile" id="mobile" />
<br />
<div class="label">DOB</div>
<input type="text" name="dob" id="dob" class="datepicker"/>
<br />
<div class="label">Location</div>
<input type="text" name="location" id="location" />
<br />
<div class="label">State</div>
<input type="text" name="state" id="state" />
<br />
<div class="label">Gender</div>
<input type="radio" name="gender" id="gender" value="male" />
Male
<input type="radio" name="gender" id="gender" value="female" />
Female<br />
<div>
<br />
<input type="checkbox" name="agree" id="mobile" />
Do You accept our terms of service?<br />
<br />
<div>
<input type="submit" name="submit" value="Submit" />
</div>
</form>
</body>
</html>
【问题讨论】：
-
在此处阅读 jquery/js 中的正则表达式。 sitepoint.com/jquery-basic-regex-selector-examples
-
你可以使用正则表达式。
-
我看到你正在使用
jquery.validate.min.js插件。你只需要使用它...（阅读它的文档 :) -
你能用我的代码演示一下吗？ @杰里米
标签： javascript php jquery sql jquery-plugins