1 <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> 2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 3 <html> 4 <head> 5 <title>checkbox</title> 6 <script type="text/javascript" src="js/jquery1.8.min.js"></script> 7 <script type="text/javascript"> 8 $(function() { 9 $("input[name=‘cbServerType‘]:checkbox").click(function() { 10 var type = ‘‘; 11 $("input[name=‘cbServerType‘]:checkbox").each(function() { 12 if ($(this).attr("checked")) { 13 type += $(this).attr(‘value‘) + ‘|‘; 14 } 15 }); 16 alert(type); 17 $("#txtServerType").val(type); 18 }); 19 }); 20 </script> 21 </head> 22 23 <body> 24 <div align="center"> 25 <span><input name=‘cbServerType‘ type=‘checkbox‘ value=‘1‘ />1111111</span> 26 <span><input name=‘cbServerType‘ type=‘checkbox‘ value=‘2‘ />2222222</span> 27 <span><input name=‘cbServerType‘ type=‘checkbox‘ value=‘3‘ />3333333</span> 28 <span><input name=‘cbServerType‘ type=‘checkbox‘ value=‘4‘ />4444444</span> 29 <span><input name=‘cbServerType‘ type=‘checkbox‘ value=‘5‘ />5555555</span> 30 </div> 31 </body> 32 </html>
显示显效果：