Question

无论我尝试什么，我都无法获得一个表单来验证，所以我已经把它弄得很笨，看看我是否可以得到任何工作，而且当我提交表单时，javascript无法验证，而且只是不管发生什么，都把我送到下一页。你们看错了什么？

HTML

<form id="myform" action="/" method="post" onsubmit="return Validate()">
<input id="form_name" type="text" name="name" placeholder="Name" />
<div id="error">Name too short</div>
<input type="submit" id="submit" name="submit" value="Enter" />

JAVASCRIPT IN HEAD

<script language="JavaScript" type="text/javascript">
   function Validate() {
      if (form.name.value == "") {
         $('#error').show();
         return false ;
       }
      return true ;
   }
</script>

在CSS中，我将#error div的显示设置为none。最后，我想检查用户在文本输入字段中输入了至少4个字符，如果他们没有，那么我不希望提交表单，而是显示错误消息。但是现在我只是检查它是否空，看看我是否可以得到任何工作。有任何想法吗？

Answer 1

首先从脚本标记中删除language，不推荐使用它。那么你不应该在head部分加载你的脚本。而是将其放在body结束的位置，以确保HTML已加载。

同样在您的验证功能中，您似乎并未真正定位正确的ID。

使用此：

function Validate() {
  if ($('#form_name').val() === '') {
    $('#error').show();
    return false ;
  }
   return true ;
}

Answer 2

定义标签的ID并使用jQuery获取这些标签并检查其值。例如，如果name标签有id =“form_name”，你可以这样做：

if ($("#form_name").val() == ""))
    $('#error').show();

另一方面，我建议您检查jQuery Validate插件，该插件非常适合验证表单：

http://jqueryvalidation.org/

Answer 3

替换您的javascript

function Validate() {
    // Use form_name instead of form.name
    if (form_name.value == "") {
      // This line will break if you do not have jquery.
      $('#error').show();
    return false ;
  }
  return true ;
}

Answer 4

而不是

if (form.name.value == "") {

使用：

var nameField=document.getElementById("form_name");
if (nameField.value == "") {

让我知道这是否有效。

Javascript表单验证，缺少什么？

4 个答案: