<html> <head> <script src="jquery-1.7.2.min.js"></script> <script src="jquery.easyui.min.js" ></script> <link rel="stylesheet" href="css/themes/metro/easyui.css" ></link> <link rel="stylesheet" href="css/themes/icon.css" ></link> </head> <body> <form class="ui-forms p20" > <input type="text" id="ysvalue" > <fieldset> <legend>反作弊数据导出</legend> <div class="pt20"> <table> <tr> <td><label style="float: none">团单 </label> <input type="text" id="byJobName" name="byJobName" value="" size="20" ></td> <td><input type="checkbox" id="byJobName" name="byJobName" value="" size="20" >只看黑名单团单</td> </tr> <tr> <td><label style="float: none">订单ID</label> <input type="text" id="byJobClass" name="byJobClass" value="" size="20" ></td> <td><label style="float: none">券码ID</label> <input type="text" id="byJobClass" name="byJobClass" value="" size="20" ></td> </tr> <tr> <td><label style="float: none">预算</label> <select id="cc" style="width:150px"></select> <span style="white-space:pre"> </span> <div id="sp"> <span style="white-space:pre"> </span> <input type="checkbox" id="ysqu" value="01" onclick="ysqx();"><span>全选</span><br/> <span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="01"><span>Java</span><br/> <span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="02"><span>C#</span><br/> <span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="03"><span>Ruby</span><br/> <span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="04"><span>Basic</span><br/> <span style="white-space:pre"> </span> <input type="checkbox" id="lang" value="05"><span>Fortran</span> <span style="white-space:pre"> </span> </div> </td> <td> </td> <td><button type="button" class="ui-button-red ui-button ui-widget ui-Status-default ui-corner-all ui-button-text-only" onclick="search();" > 查 询 </button> <button type="button" id="btnReset" name="btnReset" class="ui-button-red ui-button ui-widget ui-Status-default ui-corner-all ui-button-text-only" > 重 置 </button> </td> </tr></table> </div> </fieldset> </form> <body> </html> <script type="text/javascript"> // ready后把复选框列表加载到对应的select组里 $(function(){ $('#cc').combo({required:true,editable:false}); $('#sp').appendTo($('#cc').combo('panel')); $('#sp input').click(function(){ var s = ""; if ($(this).attr("checked")){ // 当前复选框是选中状态 s = $(this).next('span').text(); $('#cc').combo('setText', s); } else { // 当前复选框是非选中状态,则找最近一个选中的状态,如果没有返回空值 for (var i=0;i<lang.length;i++ ){ if(lang[i].checked){ s = $(lang[i]).next('span').text(); break; } } $('#cc').combo('setText', s); } }); }); // 点击查询按钮 function search(){ var value = ""; for (var i=0;i<lang.length;i++ ){ if(lang[i].checked){ value=value+lang[i].value + ","; } } // 获取所有选中的复选框的值,把值填充到一个text里方便后面使用 ysvalue.value = value; } // 预算下拉复选框全选 function ysqx(){ if (ysqu.checked) { // 选中全选,让所有复选框选中 for (var i=0;i<lang.length;i++ ){ lang[i].checked = true; } } else { // 取消全选 for (var i=0;i<lang.length;i++ ){ lang[i].checked = false; } } } </script>
时间: 2024-10-10 15:28:58