表单选择器

来源:互联网 发布:javascript template 编辑:程序博客网 时间:2024/05/22 00:14
<!doctype html><html lang="en"> <head>  <meta charset="UTF-8">  <meta name="Generator" content="EditPlus®">  <meta name="Author" content="">  <meta name="Keywords" content="">  <meta name="Description" content="">  <title>表单选择器</title>  <script src="jquery-1.8.0.js"></script> </head> <style type="text/css">body{font-size:12px;text-align:center;}form{width:241px;}textarea,select,button,input,span{display:none;}.btn{border:solid 1px #666;padding:2px;width:60px;fifter:progid:DXImageTransfrom.Microsoft.Gradient(GradientType=0,StartColorStr=#fff,EndColorStr=#ECE9D8);}.txt{border:#666 1px solid;padding:3px;}.img{padding:2px;border:solid 1px #ccc;}.div{border:solid 1px #ccc;background-color:#eee;padding:5px;} </style>  <script type="text/javascript">//**************************************$(function(){$("#form1 div").html("input类型元素:"+$("#form1 :input").length);$("#form1 div").addClass("div");});$(function(){$("#form1 :text").show(300);});$(function(){$("#form1 :password").show(300);});$(function(){$("#form1 :radio").show(300);});$(function(){$("#form1 :checkbox").show(300);});$(function(){$("#form1 :submit").show(300);});$(function(){$("#form1 :reset").show(300);});$(function(){$("#form1 :button").show(300);});$(function(){$("#form1 :file").show(300);});//************************************** </script> <body><form id="form1"><textarea class="txt">TextArea</textarea><select><option value="0">Item 0</option></select><input type="text" value="Text" class="txt" /><input type="password" value="password" class="txt" /><input type="radio" /><span id="Span1">Radio</span><input type="checkbox" /><span id="Span2">checkbox</span><input type="submit" value="Submit" class="btn" /><input type="image" title="Image"  src="Images/number_4.png" class="img" /><input type="reset" value="reset" class="btn" /><input type="button" value="button" class="btn" /><input type="file" title="File" class="txt" /><div id="divShow"></div></form> </body></html>

0 0
原创粉丝点击