| <html xmlns="http://www.w3.org/1999/xhtml"> |
| |
<head> |
| |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
| |
<title></title> |
| |
<script src="Script/jquery-3.3.1.js"></script> |
| |
<script type="text/javascript"> |
| |
|
| |
|
| |
$(function () { |
| |
$("input:button").click(function (event) { |
| |
str = ""; |
| |
str += "姓名：" + $(":text").val() + "\n"; |
| |
str += "性别：" + $(":radio:checked").next().text() + "\n"; |
| |
str += "爱好："; |
| |
like = []; |
| |
$(":checkbox:checked").each(function (index, el) { |
| |
like.push($(this).next().text()); |
| |
}); |
| |
str += like.join(","); |
| |
alert(str); |
| |
}); |
| |
}) |
| |
</script> |
| |
</head> |
| |
<body> |
| |
<form> |
| |
<div style="width:400px;"> |
| |
姓名：<input type="text" /><br /><br /> |
| |
性别：<input type="radio" name="sex" value="1" /> |
| |
<span>男</span> |
| |
<input type="radio" name="sex" value="2" /><span>女</span><br /><br /> |
| |
爱好：<input type="checkbox" name="like" value="游泳" /><span>游泳</span> |
| |
<input type="checkbox" name="like" value="爬山" /><span>爬山</span> |
| |
<input type="checkbox" name="like" value="打球" /><span>打球</span> |
| |
<input type="checkbox" name="like" value="骑车"/><span>骑车</span> |
| |
<input type="checkbox" name="like" value="阅读"/><span>阅读</span> |
| |
<input type="checkbox" name="like" value="聊天" /><span>聊天</span><br /><br /> |
| |
<center><input type="button" value="提交" style="background-color:forestgreen; width:100px;height:40px;"/> |
| |
<input type="reset" value="重置" style="background-color:forestgreen;width:100px;height:40px;"/></center> |
| |
</div> |
| |
</form> |
| |
</body> |
| |
</html> |