javascript - 如何在javascript中隐藏错误框验证

标签 javascript html

下面的代码可以工作,但我想对此代码进行一些修改。

当用户未填充该框时,它会显示错误框,该部分正在工作,但填充后它应该消失。所以请任何人帮助我解决这个问题。

我在这里发布了代码,包括 html 和 java 脚本,因此只需复制并运行它即可工作并尝试解决我的问题。

   <html>
   <head>
   <script type="text/javascript">
  function validate()
          {

  var fname = document.form.Name.value;
  var lname = document.form.Lame.value;
  var same  = document.form.Same.value;

  if( fname == "" )
   {
     document.form.Name.focus() ;
     document.getElementById("errorBox1").innerHTML = "enter the first name";
     return false;
   }

   if( lname == "" )
   {
     document.form.Lame.focus() ;
     document.getElementById("errorBox2").innerHTML = "enter the last name";
     return false;
   }

  if( same == "" )

   {
     document.form.Same.focus() ;
     document.getElementById("errorBox3").innerHTML = "enter the Same name";
     return false;
   }
    }

    </script>
    </head>
     <body>
 <form name="form" >


 SSS :<input type="text" name="Name" value=""  class="input_name" ><div    id="errorBox1"> </div>
  <br> 
   SSmjhjk :<input type="text" name="Lame" value=""  class="input_name" ><div id = "errorBox2"></div>
  <br> 

 nngb :<input type="text" name="Same" value=""  class="input_name" ><div id = "errorBox3"></div>


    <input type=button  onClick="validate()" value=check> 

         </form>

最佳答案

在我的第一个通知中,您的脚本中有语法错误。在最后一个条件中,您编写了类似 if else if(same == "") 的代码。这是错误的。

如果您想同时检查并显示所有文本框的错误,那么您需要从脚本中删除 return 属性。如下更新您的脚本。

function validate()
{
 var fname = document.form.Name.value;
 var lname = document.form.Lame.value;
 var same  = document.form.Same.value;
 document.getElementById("errorBox1").innerHTML ="";
 document.getElementById("errorBox2").innerHTML ="";
 document.getElementById("errorBox3").innerHTML ="";
 if( fname == "" )
 {
      document.getElementById("errorBox1").innerHTML = "enter the first name";
 }

 if( lname == "" )
 {

 document.getElementById("errorBox2").innerHTML = "enter the last name";
 }

 if( same == "" )
 {

 document.getElementById("errorBox3").innerHTML = "enter the Same name";
 }
}

HTML

  <form name="form" >


  SSS :<input type="text" name="Name" value="" class="input_name" onkeyup="validate();" /><div id="errorBox1"> </div>
     <br> 
     SSmjhjk :<input type="text" name="Lame" onkeyup="validate();" value=""  class="input_name" /><div id = "errorBox2"></div>
     <br> 
  nngb :<input type="text" name="Same" onkeyup="validate();" value=""  class="input_name" /><div id = "errorBox3"></div>

  <input type="button" onclick="validate();" value="check" /> 

     </form> 

Fiddle Demo

关于javascript - 如何在javascript中隐藏错误框验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24302990/

相关文章:

javascript - 切换按钮的背景颜色

html - 在 anchor 标记内创建 anchor 标记

php - 在整个页面上拉伸(stretch) CSS 导航栏

javascript - 购物车 : Using ajax calls in template - 403 Forbidden Error

javascript - 在 jQuery 中匹配标签和字符串

javascript - Google Maps API 3. 叠加层中的文本选择

Php - imap_delete - 删除刚刚选择的电子邮件

javascript - 将jquery数据存储在html元素中

jquery - 用轮播 overflow hidden

javascript - 如何在 Firefox 插件 sdk 扩展中使用来自 main.js 的 XMLHttpRequest。 (或类似的东西)