你的心如利箭 在风中笔直的飞翔
github DNS ALEXA CDN
jquery JS CSS CSS3 HTML5 svg php --- isux w3cplus

21270

  博客园  :: 首页  ::  ::  ::  :: 管理

可以用于表单提交验证时,如果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  阅读(1869)  评论(0编辑  收藏  举报