表单：校验提示信息的位置

可以用于表单提交验证时，如果input文本框填写不符合要求的信息，可以在文本框右边显示错误提示。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(function(){
    $("input[name=username]").next().show();
    $("input[name=school]").siblings(".errormsg").show();
});
</script>
<style type="text/css">
.errormsg{
    position:absolute;
    display:none;
    color:red;
    white-space:nowrap;
}
ul｛list-style:none;}
li{
    position:relative;
    width:200px;
    color:#999999;
}
</style>

</head>
<body>
<ul>
<li>姓名<span style="color:red;">*</span> <input type="text" name="username"><span class="errormsg">错啦错啦错啦错啦111111111</span></li>
<li>公司<span style="color:red;">*</span> <input type="text" name="company"><span class="errormsg">错啦错啦错啦错啦222222222</span></li>
<li>学校<span style="color:red;">*</span> <input type="text" name="school"><span class="errormsg">错啦错啦错啦错啦333333</span></li>
</ul>

</body>
</html>

posted on 2014-01-15 12:10 bjhhh 阅读( ...) 评论( ...) 编辑收藏

转载于:https://www.cnblogs.com/qq21270/p/3520552.html

表单：校验提示信息的位置

悦读