Jquery警告框不仅显示空名称,也不显示父姓名,电子邮件等。 当我点击提交按钮时,它会说,"请输入姓名",即使父姓名字段或电子邮件字段为空。
以下是代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>bem</title>
</head>
<body>
<div class="header">
<div class="header__left">
<!-- Left column content -->
</div>
<div class="header__search">
<!-- Should this be attached to the header? Or a new context <div class="search"> as it can be used elsewhere on the site? -->
</div>
</div>
</body>
</html>
答案 0 :(得分:0)
让你开始吧。
基于您的示例
$('#txtName').val();
if (name == "") {
alert("please enter the name");
return ;
}
&#34;名称&#34;没有定义。检查实际上没有做任何事情。
请注意:此示例不会检查此人是否已删除之前输入的内容。
$(document).ready(function () {
var limit = 10;
$("#btnSubmit").click(function () {
var Name = $('#txtName').val();
var FatherName = $('#txtFatherName').val();
var CellNo = $('#txtCellNo').val();
var Email = $('#txtEmail').val();
var Address = $('#txtAddress').val();
if (Name == "") {
alert("please enter the name");
return ;
} else if (FatherName == "") {
alert("please enter ur father name");
return;
} else if (Email == "") {
alert("please enter email");
return;
} else if (Address == "") {
alert("please enter address");
return;
} else if (CellNo == "") {
alert("please enter cell");
return;
}
});
});
&#13;
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<form id="form1" runat="server">
<div id="personalInfo">
<div>
<div class="container">
<h1>Personal Information</h1>
</div>
<br />
<div class="row">
<div class="col-sm-2 text-right">Name :</div>
<div class="col-sm-4">
<input type="text" id="txtName" class="cls1" name="txtName" size="20" />
</div>
</div>
<br />
<div class="row">
<div class="col-sm-2 text-right">Father Name :</div>
<div class="col-sm-4">
<input type="text" id="txtFatherName" class="cls1" name="txtFatherName" size="20" />
</div>
</div>
<br />
</div>
<div class=" row">
<div class="col-sm-2 text-right">Email:</div>
<div class="col-sm-4">
<input type="text" id="txtEmail " class="cls1" name="txtEmail" size="20" />
</div>
</div>
<div>
<br />
<div class="row">
<div class="col-sm-2 text-right">Address</div>
<div class="col-sm-4">
<input type="text" id="txtAddress" class="cls1" name="txtAddress" size="20" />
</div>
</div>
<br />
<div class="row">
<div class="col-sm-2 text-right">Cell No:</div>
<div class="col-sm-4">
<input type="text" id="txtCellNo" class="cls1" name="txtCellNo" size="20" />
</div>
</div>
<br />
<div class=" row">
<div class=" col-sm-2 text-right"></div>
<div class="col-sm-2">
<button type="button" id="btnSubmit" class="btn btn-primary">Submit</button>
<button type="button" id="btnCancel" class="btn btn-default">Cancel</button>
</div>
</div>
</div>
</div>
</form>
&#13;