javascript - 使用 jQuery 进行文本区域验证

Question

我希望仅在表单的文本区域中输入字母它适用于输入字段，无法验证文本区域是否可以使用 jquery validate ？或者还有什么其他选择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/