javascript 如何在文本输入 HTML 中添加多个电子邮件地址
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23803627/
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
How to add multiple Email addresses in text input HTML
提问by Himanshu97
In HTML5 in Used this code, i want user to be able to add multiple email addressin input box...
在使用此代码的 HTML5 中，我希望用户能够在输入框中添加多个电子邮件地址...
<div class="modal-body row-fluid" align="left">
<span class="loader-gif" style="display:none;"><img src="<?php echo $baseURL?>/watever/img/ajax-loader-horizontal.gif"></span>
Email:
<input type="email" multiple="multiple" autofocus="" pattern="^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$" style="display:none;width:91%;cursor:text;" />Links:
<input type="text" readonly="readonly" style="display:none;width:91%;cursor:text;" />
<span class="message" style="display:none;"></span>
</div>
I have added Multiple property in input type="email", still i am not able to add more than one email address in my browser,
我在 input 中添加了 Multiple 属性type="email"，但我仍然无法在浏览器中添加多个电子邮件地址，
i am using, firefox latest version for testing. I just want to know, what is the way, to allow user to add multiple email addresses in that input box? and how to later retrieve those values using Javascript.
我正在使用 Firefox 最新版本进行测试。我只想知道，有什么方法可以让用户在该输入框中添加多个电子邮件地址？以及以后如何使用 Javascript 检索这些值。
回答by sandipshirsale
try this, include the jquery and validate js file as per your file location
试试这个，包括 jquery 并根据您的文件位置验证 js 文件
<html>
<head>
<script src="jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="jquery.validate.min.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
jQuery.validator.addMethod("multiemail", function (value, element) {
if (this.optional(element)) {
return true;
}
var emails = value.split(','),
valid = true;
for (var i = 0, limit = emails.length; i < limit; i++) {
value = emails[i];
valid = valid && jQuery.validator.methods.email.call(this, value, element);
}
return valid;
}, "Please separate email addresses with a comma and do not use spaces.");
$("#emailFrm").validate({
errorElement:'div',
rules: {
emails: {
required: true,
multiemail:true
}
},
messages:
{
emails: {
required:"Please enter email address."
}
}
});
});
</script>
</head>
<body>
<form method="post" id="emailFrm">
<input type="text" name="emails" />
<input type="submit" name="submit" value="submit">
</form>
</body>
democlick here
演示点击这里
