摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> *{font-size: 11px
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{font-size: 11px}
.form{width: 500px;height: 700px;border:3px solid #ccc;border-radius: 5px;margin:10px auto;}
}
</style>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#agree").focus(function(){
$("#reg").removeAttr("disabled")
});
$("#refuse").focus(function(){
$("#reg").attr("disabled","")
})
$("#name").click(function(){
$("#name").css("background-color","#DD5246")
})
$(':selected').css('background','blue');
$(':enabled').css('background','yellow');
$(':selected').css('background','blue');
});
</script>
</head>
<body>
<!-- enabled 激活的input元素
disabled 禁用狀態(tài)
selected 被選取的
checked 所有被選中的 -->
<div>
<h3 >會(huì)員注冊(cè)登記</h3>
<hr>
<form action="" style="margin-left:100px;">
<label for="name">用戶名：</label>
<input type="text" name="sex" id="name" />
<br/><br/>
<label for="password">密  碼:</label>
<input type="password" name="sex" id="password" />
<br/><br/>
<label for="">性別：</label>  
<input type="radio" name="sex" id="sex1" value="男" checked /><label for="sex1">男</label>  
<input type="radio" name="sex" id="sex2" value="女" />
<label for="sex2">女</label>
<br/><br/>
<label for="hobby">興趣：</label>
<input type="checkbox" name="hobby" id="hobby" />
<label for="hobby">足球</label>
<input type="checkbox" name="hobby" id="hobby1" />
<label for="hobby1">藍(lán)球</label>
<input type="checkbox" name="hobby" id="hobby2" />
<label for="hobby2">排球</label>  
<br/><br/>
<label for="edu">學(xué)歷：</label>
<select name="" id="edu">
<option>幼兒園</option>
<option>小學(xué)</option>
<option selected>初中</option>
<option>高中</option>
<option>大學(xué)</option>
</select>
<br/><br/>
<label for="">注冊(cè)協(xié)議：</label>
<input type="radio" name="sex" id="agree" />
<label for="agree">同意</label>
<input type="radio" name="sex" id="refuse" checked/>
<label for="refuse">拒絕</label><br/><br/>
<input type="button" id="reg" value="注冊(cè)" style="width:80px;height:30px" disabled/>   
<input type="reset" ="reset1" value="取消" style="width:80px;height:30px" />
<br/><br/><br/><br/>
</form>
</div>
</body>
</html>
批改老師：天蓬老師批改時(shí)間：2018-12-07 08:55:45
老師總結(jié)：jQuery中的DOM操作,功能強(qiáng)大,也是最吸引人的地方