Question

验证正在处理输入字段，但它拒绝在textarea上执行此操作。为什么？当我将textarea的长度记录到控制台时，它表示document.guest未定义...但在我看来显然不是这样，因为它处理输入字段。

  <script type="text/javascript">
  function fcheck() {
    if (document.guest.name.value.length < 1) {
      alert("Du musst einen Namen eingeben!");
      return false;
    }
    if (document.guest.email.value.length < 1) {
      alert("Du musst eine Email eingeben!");
      return false;
    }
    if (document.guest.message.value.length < 1) {
      alert("Du musst eine Nachricht eingeben!");
      return false;
    }
    return true;
  }
  </script>

<div id="test2" class="col-md-6 form-group">
      <form action="addcomment.php" method="post" name="guest" onSubmit="return fcheck();">

        <div class="textform">
            <p>Name:
            <input type="text" name="name" class="form-control"/>
            </p>
        </div>

        <div class="textform">
            <p>E-Mail:
            <input type="text" name="email" class="form-control"/>
            </p>
        </div>

        <div class="textform">
            <p>Nachricht(Maximal 300 Zeichen):</p>
            <textarea cols="50" name="message" rows="10" class="form-control status-box" maxlength="300"> </textarea>
        </div>
        <br>
        <div class="pull-left">
            <p class="counter">300</p>
        </div>

        <div id="textarea" class="pull-right">
            <input type="submit" value="Nachricht abschicken" class="btn btn-primary" />
        </div>
      </form>
    </div>

Answer 1

首先，您需要使用form阻止preventDefault默认操作。所以在html中替换这行代码:(更多信息：JavaScript code to stop form submission ）

onSubmit="return fcheck();"

with：

onSubmit="event.preventDefault(); fcheck();"

第二，在你的javascript中：

<script type="text/javascript">
    function fcheck() {
        if (document.forms.guest.name.value.trim().length < 1) {
            alert("Du musst einen Namen eingeben!");
            return false;
        }
        if (document.forms.guest.email.value.trim().length < 1) {
            alert("Du musst eine Email eingeben!");
            return false;
        }
        if (document.forms.guest.message.value.trim().length < 1) {
            alert("Du musst eine Nachricht eingeben!");
            return false;
        }
        return true;
    }
</script>

Answer 2

你应该写：

document.forms.guest

而不是：

document.guest

您还应该看一下answer。

编辑：事实上，你的textarea的长度是＆＃34; 1＆＃34; ！见edited fiddle。这是由于空间特征。删除它，它会工作。

Answer 3

textareas不会在document.form上显示，您可以这样访问： -

document.guest.elements["message"].value

简单验证拒绝验证textarea

3 个答案: