用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强大的功能。

评论