【问题标题】:Validation using bootstrap tooltip and jQuery?使用引导工具提示和 jQuery 进行验证?
【发布时间】:2013-11-21 10:56:50
【问题描述】:
我有一个表单,用户可以在其中输入所有必需的数据。
当用户输入无效数据(例如在他/她的姓名字段中输入数字)时,应在该字段上生成工具提示。
如何实现这个功能?我的表格看起来像这样。
- 名字
- 姓氏
- 电话号码
- 电子邮件
- 部门 6) 出生日期等
【问题讨论】:
标签:
javascript
html
jquery-ui
twitter-bootstrap
【解决方案1】:
我假设您的名字输入 id 是“first_name”并且您想要进行长度验证。
您应该使用您的验证示例制作一个 javascript 函数:
function valid_first_name() {
if (($("#first_name").val().length > 3) && ($("#first_name").val().length < 20)) {
return true;
}
else {
return false;
}
}
$(document).ready(function() {
$('#first_name').on('blur', function() {
if (!valid_first_name()) {
$("#first_name_error").text("invalid name").css('color', '#FF0000').show();
}
});
});
和你的 html :
<div id="first_name_error" style="display:none"></div>
<input type="text" id="first_name">
这只是一个对 blur 进行长度验证的基本示例。