jquery - 如何对特定元素使用 errorPlacement？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4032865/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery - how to use errorPlacement for a specific element?
提问by freedayum
I have checkbox and a text follows it, like;
[checkbox] I agree
我有复选框，后面跟着一个文本，比如；
[复选框] 我同意
If the checkbox is not clicked when submitting, the current way of showing the error msg I have is(I use errorElement:"div");
如果提交时未单击复选框，则当前显示错误消息的方式是（我使用 errorElement:"div");
[checkbox]
This field is required.
I agree**
[复选框]
此字段是必需的。
我同意**
I would rather like;
[checkbox] I agree
This field is required
我宁愿;
[复选框] 我同意
此字段为必填项
Any idea how to get this done?.
知道如何完成这项工作吗？
The html wrap for the concerned checkbox and text elements I have is like this;
[div] [checkbox] I agree [/div] [div][/div]
我拥有的相关复选框和文本元素的 html 包装是这样的；
[div] [checkbox] 我同意[/div] [div][/div]
I tried errorPlacment:as follows hoping to apply it just for that element alone;
我尝试了errorPlacment:如下，希望仅将其应用于该元素；
...
messages: {
usage_terms: {
required: "Must agree to Terms of Use.",
//errorElement: "div"
errorPlacement: function(error, element) {
error.appendTo( element.parent("div").next("div") );
}
}
}
...
It didn't work. Any idea?.
它没有用。任何的想法？。
回答by Nick Craver
errorPlacementisn't underneath messages (as an option), it's a global option, so instead it should look like this:
errorPlacement不是在消息下面（作为一个选项），它是一个全局选项，所以它应该是这样的：
messages: {
usage_terms: "Must agree to Terms of Use."
}
errorPlacement: function(error, element) {
if(element.attr("name") == "usage_terms") {
error.appendTo( element.parent("div").next("div") );
} else {
error.insertAfter(element);
}
}
Here's we're just checking the element name when deciding where it goes, you could do another check though, for example giving all the ones that behave like this a class, and doing element.hasClass("placeAfter").
在这里，我们只是在决定元素的位置时检查元素名称，但您可以进行另一次检查，例如将所有行为类似于此的类分配给一个类，然后执行element.hasClass("placeAfter").
回答by Carlos Garrido Vigo
file html
文件 html
<label for="Q008" class="control-label titular">Question text 008 by example</small></label>
<input type="text" class="form-control" name="Q008" id="Q008" maxlength="500" />
<div id="Q008error"></div>
<label class="control-label titular">Question text 009 by example</label>
<div class="controls">
<input type="checkbox" name="Q009" id="Q009_1" value="1" />
<label for="Q009_1">Text 91</label>
</div>
<div class="controls">
<input type="checkbox" name="Q009" id="Q009_2" value="2" />
<label for="Q009_2">Text 92</label>
</div>
<div class="controls">
<input type="checkbox" name="Q009" id="Q009_3" value="3" />
<label for="Q009_3">Text 93</label>
</div>
<div class="controls">
<input type="checkbox" name="Q009" id="Q009_4" value="4" />
<label for="Q009_4">Text 94</label>
</div>
<div class="controls">
<input type="checkbox" name="Q009" id="Q009_5" value="5" />
<label for="Q009_5">Text 95</label>
</div>
<div class="controls">
<input type="checkbox" name="Q009" id="Q009_6" value="6" />
<label for="Q009_6">Text 96</label>
</div>
<div id="Q009error"></div>
jquery validate file
jquery 验证文件
errorPlacement: function(error, element) {
var elementForm = "", containerError = "";
offset = element.offset();
elementForm = element.attr("name");
containerError = "#" + elementForm + "error";
error.prependTo(containerError);
error.addClass('message');
}
