用JQuery这个强大而优秀的javascript库做了一个简单的反馈表单，因为这几天都在看JQuery的有关资料，所以接下来的几日，我为陆续介绍下JQuery的有关特性。我都是刚刚开始学的，开始看<<JQuery Reference Guide>>和JQuery官方上的有关文档资料，都是配合起来看效果好很多。看了一下，体验一下JQuery的Selectors特性。
Cure Code：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB2312">
<title>Simple form</title>
<script language="JavaScript" src="lib/jquery/jquery.js"></script>
<script language="JavaScript">
$(document).ready(function(){
$('span#title').css("border","3px solid #FF0000");
$('p>span').css("border-bottom","1px dotted #000000");
$('dt>label').css("float","left");
$('dd>input').css("margin-bottom","5px");
$('input').css("border","1px solid #333333");
$('textarea').css("border","1px solid #333333");
$('fieldset legend').css("font-size","12px");
$('fieldset legend').css("color","blue");
$("dl dd:nth-child(even)").append("<span>*</span>").css("color","red");
});
</script>
</head>
<body>
<div id="container">
<span id="title">感谢你访问我们的网站!</span>
<fieldset>
<legend>请填写以下表单:</legend>
<dl>
<dt><label>你的姓名:</label></dt>
<dd><input type="text" id="name" /></dd>
<dt><label>Your company name:</label></dt>
<dd><input type="text" id="coname" /></dd>
<dt><label>Your email:</label></dt>
<dd><input type="text" id="email" /></dd>
<dt><label>Your address:</label></dt>
<dd><input type="text" id="addr" /></dd>
<dt><label>Your tel:</label></dt>
<dd><input type="text" id="tel" /></dd>
<dt><label>Your fax:</label></dt>
<dd><input type="text" id="fax" /></dd>
<dt><label>Inquiry content:</label></dt>
<dd><textarea id="content" cols="30" rows="6"></textarea></dd>
<dd><button id="submit" value="Send">Send</button></dd>
</dl>
</fieldset>
</div>
</body>
</html>
Summary:在接下来的有关文章，我会逐一介绍有关selectors强大的功能。
评论