在Jquery-验证中，如何引用标签中属性的名称？

Question

我想使用标签文本作为验证消息。为了做到这一点，我尝试在这里使用$(label[for="nameAttrName"])，代码片段：

​

$("#myForm").validate({
  rules: {
    NameQuery: "required"
  },
  messages: {
    NameQuery: "Please fill in " + $(`label[for="NameQuery"]`).text()
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.min.js"></script>


<form id="myForm">
  <label for="NameQuery">Name Query </label>
  <input name="NameQuery"/>
  <input type="submit" value="Submit"/>
</form>

​

问题是，我如何引用for=""位中的属性名，这样就不必显式地编写for="NameQuery"了？像这样

​

​

Answer 1

的问题是，我如何引用for=""位中的属性名，这样就不必显式地编写for="NameQuery"了？

不确定为什么需要一般性地写这个，因为无论如何，您必须在rules和messages对象中显式地列出每个字段。

但是，您可以相对于要验证的字段一般地针对前面的label元素.

"Please fill in " + $(element).prev('label').text();

它必须从function()内部返回，以便从插件中获得element参数.

....
required: function(params, element) {
    return "Please fill in " + $(element).prev('label').text();
}
....

演示：

​

$("#myForm").validate({
  rules: {
    NameQuery: {
       required: true
    }
  },
  messages: {
    NameQuery: {
        required: function(params, element) {
            return "Please fill in " + $(element).prev('label').text();
        }
    }
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.min.js"></script>


<form id="myForm">
  <label for="NameQuery">Name Query </label>
  <input type="text" name="NameQuery" />
  <input type="submit" value="Submit"/>
</form>

​