<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'radil_checked.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> <style type="text/css"> .menu{ border: 1px solid #ffEEcc; border-collapse: collapse; line-height: 30px; } </style> <script type="text/javascript" src="Script/jquery.js"></script> <script type="text/javascript"> function clk () { var val = $("input[type='radio'][name='num']:checked").val(); alert(val); } function changeBackColor (str) { $("#main").children(".list").children(".menu").each(function(i,v){ if(v.innerHTML == str){ $(this).css('background-color','yellow'); } else { $(this).css('background-color','white'); } }); } </script> </head> <body> <fieldset> <legend>获取单选框值</legend> <input type="radio" name="num" value="1" οnclick="clk();">1 <input type="radio" name="num" value="2" οnclick="clk();">2 <input type="radio" name="num" value="3" οnclick="clk();">3 <input type="radio" name="num" value="4" οnclick="clk();">4 <input type="radio" name="num" value="5" οnclick="clk();">5 </fieldset><br><br> <div id="main"> <div class="list"> <div class="menu">menu</div> </div> <div class="list"> <div class="menu">menu1</div> </div> <div class="list"> <div class="menu">menu2</div> </div> </div> <input type="button" value="menu" οnclick="changeBackColor(this.value)"> <input type="button" value="menu1" οnclick="changeBackColor(this.value)"> <input type="button" value="menu2" οnclick="changeBackColor(this.value)"> </body> </html>