使用php进行javascript表单验证

checkEmpty验证无效。函数未在PHP文件中执行。我尝试了下面的代码，请帮助我理解我错在哪里

我的代码在我的index.php文件中

---

第一：如果要使用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

第三：我不建议使用alertFill the box，因为一旦您尝试跳过id/Rollno字段，就使用onblur方法 1.重点将放在“名称”的下一个输入上。 2.该警报将被触发，并会显示“填充”框中的“Rollno” 3.一旦警报显示，它还将触发“Name”的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>

我将一个类“alerts”放在跨度中，以在字段不为空时隐藏它们，但它将隐藏所有跨度。只要试着配置代码，希望它能帮助你

以下是根据您的代码配置的代码：

<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>'

我所做的改变：

我只是把你的javascript放在同一个页面中 只需链接jquery.js

---

您是否检查了服务器日志中的PHP错误？4我不知道如何检查您的web服务器的错误日志。例如，如果您在Ubuntu上使用Apache，请转到/var/log/Apache/error.log，但这取决于您的配置。fn=null在您的if condition.dat被更正时应为fn==null。。但是还是没有结果…非常感谢。。我现在就来试试..一旦编辑@lourz_yani，会更新你吗？没有结果，先生

<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>

function checkEmpty(field)
{   
console.log(field);
 var fn=document.getElementById(field).value;
 if(fn==""||fn==null) 
 {
    if(field == "id")
    {
        $("#alertForId").show();
    }
 }else $(".alerts").hide();
}

<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>'