Javascript 验证表单检查 textarea 长度答案

【问题标题】：Javascript validation form check for textarea lengthJavascript 验证表单检查 textarea 长度
【发布时间】：2018-07-23 15:00:07
【问题描述】：

我正在编写 Javascript 验证代码来检查 cmets 上的空字段，每个评论文本区域至少 50 个字符。我从输入的文本中扣除 50 以显示错误弹出消息中剩余的字符。但是，当我打开表单时，我没有输入任何内容，单击提交按钮，只有问题 #2 弹出错误消息为“Q#2 - 需要 50 个字符。剩余 50 个字符。问题 #1 应该显示相同的错误消息但它没有。

你能帮帮我吗？

代码如下：

function check() {
  var errorMessage = '';

  var Q1textLength = document.getElementById('textarea1').value.length;
  var Q1text = 50 - Q1textLength
  if (Q1textLength < 50)
    errorMessage += "Q#1 - 50 character required.  " + Q1text + " characters remaining. \n";

  var Q2textLength = document.getElementById('textarea2').value.length;
  var Q2text = 50 - Q2textLength
  if (Q2textLength < 50)
    errorMessage = "Q#2 - 50 character required.  " + Q2text + " characters remaining. \n";
  if (errorMessage) {
    alert(errorMessage);
    return false;
  }
  return true;
}

<form action="action.asp" name="frm1" method="Post" />
<fieldset>
  <legend>Question 1</legend>
  <label for="Comment1">Comments:</label>
  <textarea rows="3" cols="85" name="Q1C" id="textarea1" placeholder="Write at least 50 characters" required /></textarea>
</fieldset>

<fieldset>
  <legend>Question 2</legend>
  <label for="Comment2">Comments:</label>
  <textarea rows="3" cols="85" name="Q2C" id="textarea2" placeholder="Write at least 50 characters" required /></textarea>
</fieldset>

<p class="submit"><input type="submit" onClick="return check()" value="Submit"></p>
</form>

【问题讨论】：

第二个测试分配=而不是+=。

标签： javascript

【解决方案1】：

因为您在第二个问题中使用相等的= 覆盖了变量errorMessage，所以您应该改用+=。

注意：您的textarea 中有一个额外的斜线/ 应该被删除：

<textarea .... placeholder="Write at least 50 characters" required /></textarea>
___________________________________________________________________^

function check() {
  var errorMessage = '';

  var Q1textLength = document.getElementById('textarea1').value.length;
  var Q1text = 50 - Q1textLength
  if (Q1textLength < 50)
    errorMessage += "Q#1 - 50 character required.  " + Q1text + " characters remaining. \n";

  var Q2textLength = document.getElementById('textarea2').value.length;
  var Q2text = 50 - Q2textLength
  if (Q2textLength < 50)
    errorMessage += "Q#2 - 50 character required.  " + Q2text + " characters remaining. \n";
  if (errorMessage) {
    alert(errorMessage);
    return false;
  }
  return true;
}

<form action="action.asp" name="frm1" method="Post" />
<fieldset>
  <legend>Question 1</legend>
  <label for="Comment1">Comments:</label>
  <textarea rows="3" cols="85" name="Q1C" id="textarea1" placeholder="Write at least 50 characters" required></textarea>
</fieldset>

<fieldset>
  <legend>Question 2</legend>
  <label for="Comment2">Comments:</label>
  <textarea rows="3" cols="85" name="Q2C" id="textarea2" placeholder="Write at least 50 characters" required></textarea>
</fieldset>

<p class="submit"><input type="submit" onClick="return check()" value="Submit"></p>
</form>

【讨论】：

很高兴能帮到兄弟

【解决方案2】：

改变这个

errorMessage = errorMessage+ "Q#2 - 50 character required.  " + Q2text + " characters remaining. \n";
if(errorMessage)

【讨论】：