使用 jQuery 进行文本区域验证

Question

我希望在表单的文本区域中只输入字母它适用于输入字段，无法验证文本区域是否可以使用 jquery 验证？或者什么是另一种选择 2) 这会阻止恶意代码输入（例如xss.js）

      <form action="" method="POST" enctype="multipart/form-data" name="messageForm">
  <p>name of sender: 
   <input class="input" name="sender" id="sender" value="" size="13"
     maxlength="13" dir="ltr" autocomplete="on" type="text" height="20" minlength="3" required><br>
   <p>name of receiver: 
      <input class="input" name="receiver" id="receiver" value="" size="13"
     maxlength="13" dir="ltr" autocomplete="on" type="text" height="20" minlength="3" required><br>
   <p>Message: <br>
     <textarea name="message" id="message"  type="text" value="" rows="5" cols="30" dir="ltr" required></textarea><br>
   <input value="Submit" name="button" alt="submit" onsubmit="" border="0" type="submit" align="absmiddle"></p>

 </form>
<script>
    $("#messageForm").validate();
</script>

javascript

$().ready(function () {

    $("#submit").validate({
    rules: {
        sender: {
            required: true,
            minlength: 3,
          lettersonly: true
        },
        receiver: {
            required: true,
            minlength: 3,
            lettersonly: true
        },
        message: {
          required: true,
          minlength: 5,
          maxlength: 30,
          lettersonly: true
        },
      },
     messages: {
                sender: {required:"Please enter your name"},
                receiver:{required: "Please enter receiver name up to 3 characters"},
                message: {required: "Enter your message 3-20 characters"},
          },
 });

});

当它在 chrome 上运行时，最后一部分出现错误：意外标识符

Answer 1

您正在呼叫 .validate() 两次...

这里...

<script>
    $("#messageForm").validate();
</script>

这里...

$().ready(function () {
    $("#submit").validate({...

.validate()方法仅用于在您的form上初始化插件，不能调用两次。始终忽略所有后续调用。

但是，在您的情况下，它会被忽略，因为您已将 .validate() 的第二个实例附加到 $("#submit")，其中您的表单 id 不是 submit 并且你的 form 甚至没有 id。您只能将 .validate() 方法附加到您想要验证的 form，即 name="messageForm".

你只需要这个...

$(document).ready(function () {

    $("[name='messageForm']").validate({
        rules: {
            sender: {
                required: true,
                minlength: 3,
                lettersonly: true
                ...

如评论中所述，不再推荐 $().ready(function () {...。请改用 $(document).ready(function () {...。

演示：jsfiddle.net/unapufhp/

使用 jQuery 进行文本区域验证

Textarea validation with jQuery

javascript

jquery

textarea

jquery-validate