jquery文本框效果

最新推荐文章于 2024-03-17 09:35:00 发布

你狗

最新推荐文章于 2024-03-17 09:35:00 发布

阅读量84

点赞数

文章标签： xhtml javascript ViewUI

原文链接：http://www.cnblogs.com/toLife/p/4588861.html

版权

<!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="width:500px;">
	<legend align="left">
		注册页面:
	</legend>
		<p style="width:310px;" align="right">
		username:<input type="text" id="userName" name="" value="" οnfοcus="clearText()" οnblur="checkText()" style="width:220px"/><span id="userNameSpan" style="color:red">*</span>
		</p>
	  	<p style="width:310px;" align="right">
		e-main:<input type="text" id="userName" name="" value=""  style="width:220px"/><span id="userNameSpan" style="color:red">*</span>
		</p>
	

</fieldset>

</body>
</html>

转载于:https://www.cnblogs.com/toLife/p/4588861.html

你狗

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery文本框效果

<!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><...
复制链接

扫一扫