checkEmpty验证无效。函数没有在PHP文件中执行。我尝试下面的代码,请帮助我了解我的错误。
我的index.php
文件中的代码。
<div class="main_wrapper">
<form name="myform" method="post" action="test1.php">
<div class="head_wrapper">
Rollno : <input type="text" name="id" onblur="checkEmpty('id')" value="<?php echo $id; ?>"/></br></br>
Name : <input type="text" name="name" onblur="checkEmpty('name')" value="
<?php echo $name; ?>"/></br></br>
Email : <input type="text" name="email" onblur="checkEmpty('email')"
value="<?php echo $email; ?>"/></br></br>
Phone : <input type="number" name="phone" onblur="checkEmpty('phone')"
value="<?php echo $phone; ?>"/></br></br>
Address : <input type="text" name="address" onblur="checkEmpty('address')"
value="<?php echo $address; ?>"/></br></br>
Dept_code: <input type="text" name="dept_code"
onblur="checkEmpty('dept_code')" value="<?php echo $dept_code; ?>"/></br>
</br>
</div>
<div class="foot_wrapper">
<input type="submit" name="insert" value="Addinfo"/>
<input type="submit" name="update" value="Modify"/>
<input type="submit" name="delete" value="Delete"/>
<input type="submit" name="search" value="Find"/>
<input type="submit" name="display" value="Display"/>
</div>
</form>
</div>
</body>
<script src="validation.js">
function checkEmpty(field)
{
var fn = document.getElementById(field).value;
if (fn == "" || fn = null)
{
alert("Fill the box");
}
}
function validEmail(email)
{
var fn = document.getElementById(email).value;
var format = /.+@.+/;
if (!fn.match(format))
{
alert("Enter valid mail");
}
}
</script>
答案 0 :(得分:1)
首先:如果你要使用getElementById
,你需要在你的输入标签上加上id<input type="text" name="id" onblur="checkEmpty('id')" value="<?php echo $id; ?>" id="id" /> //it is better to use id the same as the name
第二:在checkEmpty函数中你需要修复
if(fn==""||fn=null) //change the fn=null to fn == null
{
alert("Fill the box");
}
第三:我不建议使用警报(&#34;填写方框&#34;)因为你正在使用onblur方法,一旦你试图跳过id / Rollno的字段
1.重点是下一个输入名称&#39;
2.将触发警报,并说“填写”框。对于&#39; Rollno&#39;
3.警报显示后,它还会触发“名称”的onblur方法。
4.然后它将循环显示警告
我建议设置一个隐藏的跨度,作为对用户的警示,如果用户将该字段留空则显示
<input type="text" name="id" onblur="checkEmpty('id')" value="" id="id"/><span id="alertForId" hidden="" class="alerts">Fill the this field first.</span></br></br>
并且你的checkEmpty函数会以某种方式显示:
function checkEmpty(field)
{
console.log(field);
var fn=document.getElementById(field).value;
if(fn==""||fn==null)
{
if(field == "id")
{
$("#alertForId").show();
}
}else $(".alerts").hide();
}
我把课程&#39;警告&#39;在该字段不为空的情况下隐藏它们的跨度,但它将隐藏所有跨度。只是尝试配置代码,希望它能帮到你。
以下是根据您的代码配置的代码:
<div class="main_wrapper">
<form name="myform" method="post" action="index.php">
<div class="head_wrapper">
Rollno : <input type="text" name="id" id="id" onblur="checkEmpty('id')" value=""/><span id="alertForId" class="alerts" hidden="">Fill the this field first.</span></br></br>
Name : <input type="text" name="name" id="name" onblur="checkEmpty('name')" value=""/><span id="alertForName" class="alerts" hidden="">Fill the this field first.</span></br></br>
Email : <input type="text" name="email" id="email" onblur="checkEmpty('email')" value=""/><span id="alertForEmail" class="alerts" hidden="">Fill the this field first.</span></br></br>
Phone : <input type="number" name="phone" id="phone" onblur="checkEmpty('phone')" value=""/><span id="alertForPhone" class="alerts" hidden="">Fill the this field first.</span></br></br>
Address : <input type="text" name="address" id="address" onblur="checkEmpty('address')" value=""/><span id="alertForAddress" class="alerts" hidden="">Fill the this field first.</span></br></br>
Dept_code: <input type="text" name="dept_code" id="dept_code" onblur="checkEmpty('dept_code')" value=""/><span id="alertForIdDeptCode" class="alerts" hidden="">Fill the this field first.</span></br>
</br>
</div>
<div class="foot_wrapper">
<input type="submit" name="insert" value="Addinfo"/>
<input type="submit" name="update" value="Modify"/>
<input type="submit" name="delete" value="Delete"/>
<input type="submit" name="search" value="Find"/>
<input type="submit" name="display" value="Display"/>
</div>
</form>
</div>
<script type="text/javascript" src="../jquery.js"></script>
<script type="text/javascript">
// validation.js is here
//validation
function checkEmpty(field)
{
var fn=document.getElementById(field).value;
if(fn==""||fn==null)
{
if(field == "id")
$("#alertForId").show();
if(field == "name")
$("#alertForName").show();
if(field == "email")
$("#alertForEmail").show();
if(field == "phone")
$("#alertForPhone").show();
if(field == "address")
$("#alertForAddress").show();
if(field == "dept_code")
$("#alertForIdDeptCode").show();
} else{
if(field == "id")
$("#alertForId").hide();
if(field == "name")
$("#alertForName").hide();
if(field == "email")
$("#alertForEmail").hide();
if(field == "phone")
$("#alertForPhone").hide();
if(field == "address")
$("#alertForAddress").hide();
if(field == "dept_code")
$("#alertForIdDeptCode").hide();
}
}
function validEmail(email)
{
var fn=document.getElementById(email).value;
var format=/.+@.+/;
if(!fn.match(format))
{
alert("Enter valid mail");
}
}
</script>
</body>'
我所做的改变: