需求说明：点击“查看我选择的爱好”按钮，在下方显示已选择的爱好，代码如下图所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h3>选择你的爱好：</h3>
<ul>
<li><input type="checkbox" value="音乐" />音乐</li>
<li><input type="checkbox" value="登山" />登山</li>
<li><input type="checkbox" value="游泳" />游泳</li>
<li><input type="checkbox" value="阅读" />阅读</li>
<li><input type="checkbox" value="打球" />打球</li>
<li><input type="checkbox" value="跑步" />跑步</li>
<li><input type="checkbox" value="其他" />其他</li><br />
<li><input type="button" value="查看我选择的爱好" /></li>
</ul>
<p id="text"></p>
</body>
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script>
$(document).ready(function() {
//查看我的爱好
$("input[type='button']").click(function() {
//获取所有checkbox
var str = "";
$("input[type='checkbox']:checked").each(function() {
str += $(this).val() + "<br/>";
$("#text").html(str);
});
});
})
</script>
</html>