使用jQuery输入太短时显示警报消息

Question

我尝试使用jQuery在输入短于给定限制时显示警报消息。 不幸的是，我的代码无法正常工作，因此寻求您的帮助。

这是我正在使用的代码。

的HTML

<input type="textarea" name="message" id="message" row="20" col="50" />
<input type="submit" name="submit" id="submit" value="Send Message" />

的JavaScript

<script type="text/javascript">
    jQuery(document).ready(function($) {
        $("input:submit[name='submit']").on("click",function() {
        var msgwords = $("input:textarea[name='message']").val().replace( /[^\w ]/g, "" ).split( /\s+/ ).length;
        var minwords = 10;
            if (comwords < minwords) {
                alert("Your Comment is too short.");
            }
        });
    });
</script>

Answer 1

您想将if(comwords < minwords)切换为if(msgwords < minwords)

---

这是您完全可以使用的代码。 根据需要进行更改。

<script type="text/javascript">
/* Use $ instead of `jQuery`, it's nicer */
$(document).ready(function() {
    /* Reference the button ID (it's unique...) */
    $("#submit").click(function(e) {
        /* Your function to replace works nicely */
        var msgwords = $("#message").val().replace( /[^\w ]/g, "" ).split( /\s+/ ).length;
        var minwords = 10;
        if (msgwords < minwords) {
            e.preventDefault();
            alert("Your Comment is too short.");
        } 
    });
});
</script>

该代码引用了确切的ID（一旦知道它可以工作，就可以更改它）。 您的拆分函数检查单词而不是字符也可以很好地工作。 最后，如果注释太短，则e.preventDefault()阻止按钮提交。

---

我还要指出，您可以使用e.preventDefault(); 或return false ，后者等于e.preventDefault(); 和e.stopPropagation(); 。 这样可以防止该事件传播（或“冒泡”）DOM。

Answer 2

有两个问题。

1. 没有这样的:textarea伪选择器。
2. comwords未定义。

您:textarea从选择器中删除:textarea 。 并使用msgwords代替comwords 。

---

我会改为：

• 使用.form()绑定到submit事件。 另外，防止表单提交。
• 使用String#trim清理前导和尾随空格。
• 利用元素的id属性；）

遵循以下原则：

<form>
  <input type="textarea" name="message" id="message" row="20" col="50" />
  <input type="submit" name="submit" id="submit" value="Send Message" />
</form>

jQuery(function($) {
  $("form").submit(function () {
    var minwords = 10;
    /* Trim leading and trailing spaces */
    var message = $("#message").val().trim();
    var words = message.split(/\s+/).length;
    /* Disambiguous matches for an empty string  */
    if ((message == "") || (words < minwords)) {
      alert("Your comment is too short.");
      /* Prevent form submission by returning false */
      return false;
    }
    return true;
  });
});