翻译自定义 jQuery 验证消息
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/39630386/
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
Translate custom jQuery validation messages
提问by Rock Rathore
I have a question to ask regarding jQuery validation plugin.
我有一个关于 jQuery 验证插件的问题要问。
I have used localisation to change the default language of error messages to be displayed in Spanish, but I cannot find anything regarding custom messages to be translated. Any clues?
我已使用本地化来更改要以西班牙语显示的错误消息的默认语言，但我找不到有关要翻译的自定义消息的任何内容。有什么线索吗？
for example
例如
I've included the translation file for Spanish, and this is my code:
我已经包含了西班牙语的翻译文件，这是我的代码：
$('.signup-form').validate({
lang : 'es',
rules:{
tandc : {required : true}
},
messages:{
tandc : {required : "You have to accept terms and conditions to proceed further"}
}
})
Default messages like "This field is required" etc are appearing in Spanish, now I want to translate the above message to Spanish but I cannot find where and how to define the translated text.
像“此字段是必需的”等默认消息以西班牙语显示，现在我想将上述消息翻译成西班牙语，但我找不到定义翻译文本的位置和方式。
回答by Sparky
Nothing is "translated" by the plugin. Translation is done manually and then you'd place these new messages into a localization filewhere they over-ride the default.
插件没有“翻译”任何内容。翻译是手动完成的，然后您将这些新消息放入一个本地化文件中，它们会覆盖默认值。
There is also no such.validate()optioncalled langanywhere in this plugin.
还有没有这样的.validate()选项叫lang任何地方在这个插件。
To use the localization files simply means including the file as such someplace after you include the plugin...
使用本地化文件只是意味着在包含插件后将文件包含在某个地方...
<script type="text/javascript" src="...path-to/jquery.validation/1.15.0/jquery.validate.js" />
<script type="text/javascript" src="...path-to/jquery-validation/localization/messages_es.js" />
Then all default messages will be in Spanish.
然后所有默认消息都将使用西班牙语。
Default messages like "This field is required" etc are appearing in Spanish, now I want to translate the above message to Spanish but I cannot find where and how to define the translated text.
像“此字段是必需的”等默认消息以西班牙语显示，现在我想将上述消息翻译成西班牙语，但我找不到定义翻译文本的位置和方式。
Including the Spanish localization file simply tells the plugin to replace the default messages as defined by the Spanish localization file.
包含西班牙语本地化文件只是告诉插件替换由西班牙语本地化文件定义的默认消息。
Your messagesobject over-rides these default messages, so if you want a Spanish message to over-ride the requiredrule for just a single input field, then you'll need to write that one in Spanish. There is no built-in dynamic translation that can interpret your messages on the fly.
您的messages对象会覆盖这些默认消息，因此如果您希望西班牙语消息仅覆盖required单个输入字段的规则，那么您需要用西班牙语编写该规则。 没有内置的动态翻译可以即时解释您的消息。
rules:{
tandc : {
required : true
}
},
messages:{
tandc : {
required : "Tienes que aceptar los términos y condiciones de seguir avanzando"
}
}
This is the priority of messages used:
这是使用的消息的优先级：
Any text declared for a single field by rule or entire field using the
messagesobject within.validate()or similar method.If nothing defined in item #1: Over-ride plugin default messages as defined by
$.extend( $.validator.messages, {...}). This is how the Localization files work.If nothing defined in item #2: Default messages (English) as defined by the plugin.
使用
messages对象内的对象.validate()或类似方法按规则或整个字段为单个字段声明的任何文本。如果在第 #1 项中没有定义：覆盖由
$.extend( $.validator.messages, {...}). 这就是本地化文件的工作方式。如果第 2 项中没有定义：插件定义的默认消息（英语）。
Now if you need to dynamicallychange any message as defined by the messagesobject after .validate()has initialized the plugin on your form, you'll have to use the .rules('add')method to over-ride it.
现在，如果您需要在表单上初始化插件后动态更改messages对象定义的任何消息.validate()，则必须使用该.rules('add')方法来覆盖它。
$('[name="foo"]').rules('add', {
messages: {
required: "yo! I'm required."
}
});
DEMO: jsfiddle.net/3fLkf47u/
回答by Mikk
So i made simple script to translate validation messages based on accepted answer
所以我制作了简单的脚本来根据接受的答案翻译验证消息
function translateValidationMessages(currentLang) {
message = {
en: {
required: "Required.",
remote: "Please fix this field.",
email: "Wrong email.",
url: "Please enter a valid URL.",
date: "Please enter a valid date.",
dateISO: "Please enter a valid date (ISO).",
number: "Please enter a valid number.",
digits: "Please enter only digits.",
creditcard: "Please enter a valid credit card number.",
equalTo: "Please enter the same value again.",
maxlength: $.validator.format("Please enter no more than {0} characters."),
minlength: $.validator.format("Please enter at least {0} characters."),
rangelength: $.validator.format("Please enter a value between {0} and {1} characters long."),
range: $.validator.format("Please enter a value between {0} and {1}."),
max: $.validator.format("Please enter a value less than or equal to {0}."),
min: $.validator.format("Please enter a value greater than or equal to {0}.")
},
et: {
required: "See v?li peab olema t?idetud.",
maxlength: $.validator.format("Palun sisestage v?hem kui {0} t?hem?rki."),
minlength: $.validator.format("Palun sisestage v?hemalt {0} t?hem?rki."),
rangelength: $.validator.format("Palun sisestage v??rtus vahemikus {0} kuni {1} t?hem?rki."),
email: "Palun sisestage korrektne e-maili aadress.",
url: "Palun sisestage korrektne URL.",
date: "Palun sisestage korrektne kuup?ev.",
dateISO: "Palun sisestage korrektne kuup?ev (YYYY-MM-DD).",
number: "Palun sisestage korrektne number.",
digits: "Palun sisestage ainult numbreid.",
equalTo: "Palun sisestage sama v??rtus uuesti.",
range: $.validator.format("Palun sisestage v??rtus vahemikus {0} kuni {1}."),
max: $.validator.format("Palun sisestage v??rtus, mis on v?iksem v?i v?rdne arvuga {0}."),
min: $.validator.format("Palun sisestage v??rtus, mis on suurem v?i v?rdne arvuga {0}."),
creditcard: "Palun sisestage korrektne krediitkaardi number."
}
};
console.log("Translating validation messages to: "+currentLang);
if (currentLang == "et") {
$.extend($.validator.messages, message.et);
} else {
$.extend($.validator.messages, message.en);
}
And this function can be called when language dropdown is changed for example
例如，在更改语言下拉列表时可以调用此函数
$("#lang").change(function() {
translateValidationMessages(this.value)
console.log("Setting language to " + this.value);
});
Hope this helps someone
希望这有助于某人
回答by Googlian
You can use a jQuery library called abValidatewhich you can give localized validation error messages.
您可以使用一个名为的 jQuery 库abValidate，您可以提供本地化的验证错误消息。
Example:
例子：
$(document).ready(function () {
$(".ab-form").abValidate({
color: "#556b2f",
backgroundColor: "white",
debug: true
});
});<html>
<head>
<link rel="stylesheet" href="https://aslamanver.github.io/abvalidate/abValidate.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://aslamanver.github.io/abvalidate/abValidate.min.js"></script>
</head>
<body>
<form class="ab-form" action="#">
<div class="form-group">
<input type="text" ab-validation="required|Hey dude you missed that,min:5| No no you want to type more"
name="name" class="ab-validation-i" />
<div class="error"></div>
</div>
<br>
<div class="form-group">
<input type="submit" name="submit" value="Submit">
</div>
</form>
</body>
</html>You just want to write everything in HTML as below once you initialized your for with abValidatelibrary.
一旦你用abValidate库初始化你的 for ，你只想用 HTML 编写所有内容，如下所示。
<input type="text" name="name" ab-validation="required|Hey dude you missed that,min:5| No no you want to type more" class="ab-validation-i" />
abValidate- Github link:
https://github.com/aslamanver/abvalidate
abValidate- Github 链接：https:
//github.com/aslamanver/abvalidate
Reference:
https://medium.com/@aslamanver/localized-custom-validation-messages-jquery-2892e021648f
参考：https:
//medium.com/@aslamanver/localized-custom-validation-messages-jquery-2892e021648f
