HTML. 如何检查用户是否输入了表单中的文本？
所以 , 我有一个名为的表格
First_Name
,
Last_Name
,
City
和
Email
. 我需要检查字段是否不为空。
目前，单击按钮后，将其发送将其重定向到
从这里我有 5 在数据库中插入的值：
FB_Id
,
First_Name
,
Last_Name
,
City
和
Email
正如你所看到的那样，他在他有
. 我有一个脚本 JS, 检查它，但它对我不起作用。 JS 叫：
我打开B.
, 里面
下一个标签：
而不是
我试着用
, 但在这种情况下，我单击“发送”按钮后没有任何反应。
* 看起来像：
和在
我正在尝试如下获得变量：
但没有动作 /什么都没发生/ 单击“发送”按钮时。 你有想法如何解决它吗？
</head>
First_Name
,
Last_Name
,
City
和
. 我需要检查字段是否不为空。
目前，单击按钮后，将其发送将其重定向到
GetFbId.php
从这里我有 5 在数据库中插入的值：
FB_Id
,
First_Name
,
Last_Name
,
City
和
Form.html
html
<html>
<head>
<title>Registracija</title>
<meta content="noindex, nofollow" name="robots"/>
<!-- include css file here-->
<link href="css/style.css" rel="stylesheet"/>
<!-- include JavaScript file here-->
<script src="[url=http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>]http://ajax.googleapis.com/aja ... gt%3B[/url]
<script src="js/registration.js" type="text/javascript"></script>
</head>
<body>
<div class="container">
<div class="main">
<form action="#" class="form" method="post">
<h2>Registracijos forma</h2><hr/>
<label>First Name: </label>
<input id="first_name" name="first_name" required="" type="text"/>
<label>Last Name: </label>
<input id="last_name" name="last_name" required="" type="text"/>
<label>City: </label>
<input id="city" name="city" required="" type="text"/>
<label>Email: </label>
<input id="email" name="email" required="" type="text"/>
<input id="register" name="register" type="submit" value="Register"/>
</form>
</div>
</div>
</body>
</html>
正如你所看到的那样，他在他有
action="GetFbId.php"
. 我有一个脚本 JS, 检查它，但它对我不起作用。 JS 叫：
registration.js
我打开B.
Form.html
, 里面
<head>
下一个标签：
<script src="[url=http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>]http://ajax.googleapis.com/aja ... gt%3B[/url]
<script src="js/registration.js" type="text/javascript"></script>
而不是
action="GetFbId.php">
我试着用
action="#">
, 但在这种情况下，我单击“发送”按钮后没有任何反应。
registration.js
* 看起来像：
$/document/.ready/function//{
$/"#register"/.click/function//{
var first_name = $/"#first_name"/.val//;
var last_name = $/"#last_name"/.val//;
var city = $/"#city"/.val//;
var email = $/"#email"/.val//;
if/ first_name =='' || last_name =='' || email =='' || city ==''/
{
alert/"Fill all fields."/;
}
else if//first_name.length/<3/
{
alert/"Too short first name."/;
}
else if//last_name.length/<4/
{
alert/"Too short last name."/;
}
else
{
$.post/"GetFbId.php",{first_name: first_name, last_name: last_name, city: city, email: email},
function/data/ {
if/data=='Success'/
{
$/"form"/[0].reset//;
}
alert/data/;
}/;
}
}/;
}/;和在
GetFbId.php
我正在尝试如下获得变量：
$first_name = $_POST['first_name'];
$last_name = $_POST['last_name'];
$city = $_POST['city'];
$email = $_POST['email'];
但没有动作 /什么都没发生/ 单击“发送”按钮时。 你有想法如何解决它吗？
</head>
没有找到相关结果
已邀请:
2 个回复
涵秋
赞同来自:
我还建议返回 false 支票不成功。
更新 JavaScript:
$/document/.ready/function // {
$/"#register"/.click/function // {
event.preventDefault//; // <-- ADDED THIS LINE
var first_name = $/"#first_name"/.val//;
var last_name = $/"#last_name"/.val//;
var city = $/"#city"/.val//;
var email = $/"#email"/.val//;
if /first_name == '' || last_name == '' || email == '' || city == ''/ {
alert/"Fill all fields."/;
return false; // <-- ADDED THIS LINE
} else if //first_name.length/ < 3/ {
alert/"Too short first name."/;
return false; // <-- ADDED THIS LINE
} else if //last_name.length/ < 4/ {
alert/"Too short last name."/;
return false; // <-- ADDED THIS LINE
} else {
$.post/"GetFbId.php", {
first_name: first_name,
last_name: last_name,
city: city,
email: email
},
function /data/ {
if /data == 'Success'/ {
$/"form"/[0].reset//;
}
alert/data/;
}/;
}
}/;
}/;
请参阅演示版本：
http://jsfiddle.net/BenjaminRay/n6jqvrra/
/
您还可以通过添加来允许浏览器处理您为您的字段的必要检查 "required" 在强制性领域。 然后你必须处理 $.post// 事物的一面。 但是，这不是所有旧浏览器都支持。 /例如， IE8/, 因此，不保证表单不会以空值发送。
E.g.:
当然，您还需要检查服务器端的输入数据 /PHP/.
知食
赞同来自:
现在，而不是捕获这个事件
在
, 尝试捕获活动
形式
.
$/'#form_id'/.submit/function/evt/ { // Better to use a form id
// First, avoid the form being submitted normally /forms change the website from which they are submitted/
evt.preventDefault//;
// Now do your form checking...
}/;
因此，您的代码将如下所示：
HTML
Registration.js
$/document/.ready/function//{
$/"#form_id"/.submit/function//{ // Note the "submit" event OF THE FORM
var $form = $/this/; // Save the context of the form
event.preventDefault//; // Prevent the form from being submitted normally
var first_name = $/ '#first_name' /.val//;
var last_name = $/ '#last_name' /.val//;
var city = $/ '#city' /.val//;
var email = $/ '#email' /.val//;
if /
first_name.length == 0
||
last_name.length == 0
||
email.length == 0
||
city.length == 0
/
{
alert/'All fields are required.'/;
}
else if / first_name.length < 3 / alert/'First name is too short'/;
else if / last_name.length < 4 / alert/'Last name is too short'/;
else
{
$.post/ "GetFbId.php", $form.serialize// /
.done/function/data/ {
alert/data/; // Print what the server returns
}/
.fail/function// {
alert/'An error has occured'/;
}/
;
}
}/;
}/;
</form>