4 
     <form onsubmit="chkform()">
        <table>
        <tr><td>name</td><td><input type="text" id="uname"/></td></tr>
        <tr><td></td><td><div id="er1"></div></td></tr>
        <tr><td>address</td><td><input type="text" id="add"/></td></tr>
        <tr><td></td><td><div id="er2"></div></td></tr>
        </table>
        </form>
     <script>   
            function chkform()
            {


              if (document.getElementById("uname").value === "" ) 
              {

               document.getElementById("er1").innerHTML = "name cant be left blank"; 
               document.getElementById("er1").style.color = "red"; 
               document.getElementById("er1").style.display = "block"; 
              }
        }
</script>

我想在 div 中显示错误消息，如果任何字段留空，并且单击文本框时此消息应该消失。

4

5 回答 5

0 
 <form onsubmit="return false">
        <table>
        <tr><td>name</td><td><input type="text" id="uname"/></td></tr>
        <tr><td></td><td><div id="er1"></div></td></tr>
        <tr><td>address</td><td><input type="text" id="add"/></td></tr>
        <tr><td></td><td><div id="er2"></div></td></tr>
        </table>
        <input type="submit" onclick="chkform()"/>
        </form>
     <script>   
            function chkform()
            {


              if (document.getElementById("uname").value === "" ) 
              {

               document.getElementById("er1").innerHTML = "name cant be left blank"; 
               document.getElementById("er1").style.color = "red"; 
               document.getElementById("er1").style.display = "block"; 
              }
        }
</script>
于 2013-09-09T12:13:18.967 回答
0

使用以下内容将始终允许您添加inputs 而无需重新编写验证函数：

function chkform()
{
    var form = document.getElementsByTagName('form')[0];
    var inputs = form.getElementsByTagName('input');

    for(var i = 0; i < inputs.length; i++){
        if(inputs[i].value === '')
            // do your error
    }
}

Working fiddle

于 2013-09-06T12:33:32.460 回答
0

我想你return需要

<form onsubmit="return chkform()">

和

return false在您的红色警报消息块中

这样可行。

IE

<form onsubmit="return chkform()">

function chkform() {
  if (document.getElementById("uname").value === "") {
    . . .
    return false;
  }

  if (document.getElementById("car").value == "truck") {
    . . .
    return false;
  }
  . . .
}
于 2013-09-06T12:34:30.423 回答
0

尝试将两个输入框都添加到一个数组中，然后循环遍历它们以测试它们是否输入了值。

我已经编辑了你的代码。 

function chkform()
                {

    var inputs = [];
    inputs[0] = document.getElementById("uname");
    inputs[1] = document.getElementById("add");

    for( i =0; i < inputs.length; i++) {

                  if (inputs[i].value === "" ) 
                  {

                   document.getElementById("er1").innerHTML = "Please fill out all form inputs!"; 
                   document.getElementById("er1").style.color = "red"; 
                   document.getElementById("er1").style.display = "block"; 
                  }
            }
    }
于 2013-09-06T12:35:48.507 回答
0

您应该在 if 条件中添加 else 部分，这将在填充 thge 字段时删除错误消息。

else {
              document.getElementById("er1").innerHTML = ""; 
              document.getElementById("er1").style.display = "none";
              }

http://codepen.io/anon/pen/gxJid

于 2013-09-06T12:42:41.400 回答