<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript" src="jquery所有版本/jquery/1.10.2/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
//当dom加载完成后执行的代码
$(document).ready(function(){
$("#userName").prop("value","字母和数字的组合且不少于8位");
$("#userName").addClass("font");
})
function clearText(){
var v = $("#userName").val();
if(v == "字母和数字的组合且不少于8位"){
$("#userName").prop("value","");
}
}
function checkText(){
var v = $("#userName").val();
if(v == ""){
$("#userName").prop("value","字母和数字的组合且不少于8位");
$("#userName").addClass("font");
}else{
$("#userName").removeClass("font");
}
}
</script>
<style type="text/css">
.border{
border:1px solid red;
}
.font{
font-family:Arial, Helvetica, sans-serif;
color:#CCCCCC;
}
</style>
</head>
<body>
<fieldset style="500px;">
<legend align="left">
注册页面:
</legend>
<p style="310px;" align="right">
username:<input type="text" id="userName" name="" value="" onfocus="clearText()" onblur="checkText()" style="220px"/><span id="userNameSpan" style="color:red">*</span>
</p>
<p style="310px;" align="right">
e-main:<input type="text" id="userName" name="" value="" style="220px"/><span id="userNameSpan" style="color:red">*</span>
</p>
</fieldset>
</body>
</html>