Javascript验证（点击提交后输入不显示）

问题描述：

这是一个简单的代码，我不知道我在哪里出错了。名称验证工作如果没有输入名称，但它不显示结果时有效名称被输入。Javascript验证（点击提交后输入不显示）

这里是我的代码：

我在HTML和JavaScript只是新的，希望我会从这里得到帮助。谢谢

function checkname(form) { 
 
    var eobj = document.getElementById('MITname'); 
 
    var jname = form.Name.value; 
 
    var error = false; 
 

 
    eobj.innerHTML = ''; 
 

 
    if (jname == '') { 
 
     error = "Name is required!"; 
 
     var error2 = error.fontcolor("red"); 
 

 
    } 
 
    if (error) { 
 
     if (hasFocus == false) { 
 
     form.Name.focus(); 
 
     hasFocus = true; 
 
     } 
 
     eobj.innerHTML = error2; 
 
     return false; 
 
    } 
 
    return true; 
 
    } 
 

 
    function showinput() { 
 
    document.getElementById('namedisplay').innerHTML = document.getElementById('MITname').value; 
 
    } 
 

 

 
    function validate() { 
 
    hasFocus = false; 
 
    var form = document.forms['form']; 
 
    var ary = [checkname]; 
 
    var rtn = true; 
 
    var z0 = 0; 
 
    for (var z0 = 0; z0 < ary.length; z0++) { 
 
     if (!ary[z0](form)) { 
 
     rtn = false; 
 
     } 
 
    } 
 
    return rtn; 
 
    }

<form action="" name="form" onsubmit="return validate()"> 
 
    <tr> 
 
    <td align="right">Name:<font color="red">*</font> 
 
    </td> 
 
    <td> 
 
     <input type="text" name="Name" /> <span id="MITname"> </span> 
 
    </td> 
 
    </tr> 
 
    <br/> 
 
    <input type="submit" value="Submit" onclick="showinput()" /> 
 
    <br/> 
 
    <label>Your input:</label> 
 
    <p><span id="namedisplay"></span> 
 
    </p> 
 
</form>

答

此列举几个问题。（另外，欢迎来到Web开发！）

首先，你从来没有真正创建变量hasFocus。所以你永远不会真的检查它是真是假。

其次，当你创建error2意味着它只会是if()块它是在创建中访问。因此，在下面的if(error)块当您尝试访问它，它会返回undefined。第三，当您创建error时，您将值设置为false，它指示布尔类型，但稍后将其值设置为一个字符串（该字符串绝对不是布尔值）。

四，行var ary = [checkname];令我困惑。我知道你试图将名称（从输入？）转换为数组，但这不是实现它的方法。您可以使用string.charAt(index)访问名称的每个字符，因此创建数组并非真的必要。

五，你的validate()作为一个整体功能是非常混淆。我不知道你想要做什么。看起来你的教学来源可能会误导你，或者你没有密切关注。

我可以继续，但是这些（除其他外）问题实际上很难确切地发现哪里出了问题，而没有深入挖掘。我不想为你写这篇文章，所以我的建议是重新开始，也许可以从其他来源获得更多的教程。（不同的YouTube频道等）

我假设验证函数应该创建一个包含所有表单的数组，然后为每个表单调用'checkname' ...而不是迭代1个变量数组来调用'checkname' – abc123

这是我在课堂上的第一天，这是自我教导..我我不知道我在编码什么，但我打算做一个JavaScript验证..知道这个代码是可怕的，这有点让人失望.. *叹*感谢寿，我很感激它。 –

@ Geni-sama，别太难过，我们都必须从某个地方开始。我建议的做法是在线观看一些“Javascript intro”视频，并看看W3学校，因为它们对初学者有很大的帮助。 – FibreChips

答

我的问题是验证。如果输入空白名称，则应在名称文本框旁边显示一条错误消息，指示输入有效的名称。

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <title>JAVASCRIPT FORM VALIDATION</title> 
 
\t 
 
    <script type="text/JavaScript"> 
 
     function showMessage() 
 
\t \t { 
 
      var Name = document.getElementById("Name").value; 
 
      displayname.innerHTML= Name; 
 
\t \t \t 
 
\t \t \t var Email = document.getElementById("Email").value; 
 
\t \t \t displayemail.innerHTML= Email; 
 
\t \t \t 
 
\t \t \t var Website = document.getElementById("Website").value; 
 
\t \t \t displaywebsite.innerHTML= Website; 
 
\t \t \t 
 
\t \t \t var Comment = document.getElementById("Comment").value; 
 
\t \t \t displaycomment.innerHTML= Comment; 
 
\t \t \t 
 
\t \t \t var nameerror=''; 
 
\t \t \t var emailerror=''; 
 
\t \t \t var websiteerror=''; 
 
\t \t \t var commenterror=''; 
 
\t \t \t 
 
\t \t \t \t if (displayname.innerHTML=='') 
 
\t \t \t \t { 
 
\t \t \t \t nameerror = 'Please enter a valid name'; 
 
\t \t \t \t return false; 
 
\t \t \t \t } 
 
\t \t \t \t return true; 
 
     } 
 
    </script> 
 
\t 
 
</head> 
 

 
<body> 
 

 
Name: <input type="text" id = "Name"> <span id = "nameerror"> </span> 
 
<br></br> 
 
Email: <input type="text" id = "Email"> 
 
<br></br> 
 
Website: <input type="text" id = "Website"> 
 
<br></br> 
 
Comnent: <textarea cols="35" rows="7" id="Comment"> </textarea> 
 
<br></br> 
 

 
<input type="submit" onclick="showMessage()" value="submit" /> 
 

 
\t \t \t <p>Name: <span id = "displayname"></span> </p> 
 
\t \t \t <p>Email: <span id = "displayemail"></span> </p> 
 
\t \t \t <p>Website: <span id = "displaywebsite"></span> </p> 
 
\t \t \t <p>Comment: <span id = "displaycomment"></span> </p> 
 

 

 
</body> 
 
</html>

答

<form action="" name="form" onsubmit="return validate()"> 
    <tr> 
    <td align="right">Name:<font color="red">*</font> 
    </td> 
    <td> 
     <input type="text" name="Name" /> <span id="MITname"> </span> 
    </td> 
    </tr> 
    <br/> 
    <input type="button" value="Submit" onclick="showinput()" /> 
    <br/> 
    <label>Your input:</label> 
    <p><span id="namedisplay"></span> 
    </p> 
</form>

只是删除类型=在你的代码“提交”，将提交你的页面，同时点击，一旦你点击提交的是改变POST数据，因此，使用按钮

类型

Javascript验证（点击提交后输入不显示）

相关推荐