Question

当我发布表单时，标题验证工作正常，其他两个字段未经过验证。

HTML

<form name="qaform" class="nice" method="POST" onsubmit="validateForm()" action="/ask/ask-question/">

            <input type="hidden" id="id_selected_tags" name="tags">
            <p>
                <label for="id_title" class="inline-block">Title</label>
                <input type="text" class="input-text inline-block" id="id_title" name="question_title">
            </p>
            <span id="error_title"></span>

            <textarea id="id_question" name="question_description" class="full-width"></textarea>
            <span id="error_body"></span>
            <p>
                <label for="id_tags" class="inline-block">Tags</label>
                <input type="text" id="id_newstagbox" name="question_tags"/>
            </p>
            <span id="error_tags"></span>

            <button class="btn btn-success" type="submit">Post your question</button>
</form>

JS

function validateForm()
{
//title validation

if (document.qaform.question_title.value == "") {
     document.getElementById('error_title').innerHTML="*Please add a title*";
      return false;
 }


//body validation
if (document.qaform.question_description.value == "") {
     document.getElementById('error_body').innerHTML="*Please add a description*";
     return false;
}

//tag validation
if (document.qaform.question_tags.value == "") {
     document.getElementById('error_tags').innerHTML="*Please add a description*";
     return false;
}

}

如果出现标题，则成功提交表格后。

stackoverflow表单验证强迫我这样做，它不断地说我要添加更多文本，因为我的问题主要包含代码。我知道提供更多有关问题的信息很有用但有时你可以问一个用几句话来提问而不是太宽泛，然后你必须咆哮才能通过表格验证。

Answer 1

只需删除return false。修改如下

<script>
function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
var y=document.forms["myForm"]["farea"].value;
var z=document.forms["myForm"]["ftag"].value;
if (x==null || x=="")
  {
   document.getElementById('ern').innerHTML="*Please add a title*";

  }
if (y==null || y=="")
  {
   document.getElementById('era').innerHTML="*Please add a desxription*";

  }
if (z==null || z=="")
  {
   document.getElementById('ert').innerHTML="*Please add a tag*";

  }
}
</script>

Answer 2

您只需删除每个条件中的return false， 如果您删除返回虚假行，请检查此jsfiddle如何工作。

注意：返回false将停止执行

Answer 3

我更喜欢使用jQuery：

$('#form').submit(function(e) {
        var validated = true;
        e.preventDefault();

        //title validation
        if ($('#id_title').val() == "") {
            $('#error_title').html("*Please add a title*");
            validated = false;
         }

        //body validation
        if ($('#id_question').val() == "") {
            $('#error_body').html("*Please add a description*");
            validated = false;
        }

        //tag validation
        if ($('#id_newstagbox').val() == "") {
            $('#error_tags').html("*Please add a description*");
            validated = false;
        }

        if(validated) {
            $(this).unbind('submit').submit();
        }
    });

Answer 4

删除if子句中的“return false”。如果不调用子句，这将停止您的功能和另一个。

Answer 5

只需在validateform（）

之前添加'return'关键字像这样

<form name="qaform" class="nice" method="POST" onsubmit="return validateForm()" action="/ask/ask-question/">

Answer 6

尝试对validateForm方法进行这5项小改动 -

function validateForm() {
  var valid = true; // 1
  //title validation
  if (document.qaform.question_title.value == "") {
     document.getElementById('error_title').innerHTML="*Please add a title*";
     valid = false; // 2
  }

  //body validation
  if (document.qaform.question_description.value == "") {
     document.getElementById('error_body').innerHTML="*Please add a description*";
     valid = false; // 3
  }

  //tag validation
  if (document.qaform.question_tags.value == "") {
     document.getElementById('error_tags').innerHTML="*Please add a description*";
     valid = false; // 4
  }
  return valid; // 5
}

Answer 7

我认为它只验证第一个的原因是因为你返回false来退出validate函数，如果你在所有if循环之后返回false我认为它会做你想要的。

表单验证不适用于所有字段，只适用于第一个字段

7 个答案: