<html> <head> <script src="jquery-1.4.2.min.js" type="text/javascript"></script> <script src="jquery.tableEdit.js" type="text/javascript"></script> <script> $(document).ready(function(){ $('#ck_0').click(function(){ var bl = this.checked; $('input[type="checkbox"]').each(function(){ this.checked=bl; }); }); $("#zj").click(function(){ addRow("table"); }); $("#sc").click(function(){ removeRow("table"); }); $("#bc").click(function(){ alert(getJsonString("table")); }); }); function changeSel(obj){ alert(obj.value); } </script> </head> <body> <input type="button" id="zj" value="增加"/> <input type="button" id="sc" value="删除"/> <div> <table id="table" border="1" > <tr> <td><input type="checkbox" id="ck_0" name="ck_0"/></td> <td editTemplate="td1">开始符号</td> <td editTemplate="td2">开始值</td> <td editTemplate="td3">结束符号</td> <td editTemplate="td4">结束值</td> </tr> </table> </div> <input type="button" id="bc" value="保存"/> <textarea id="td1" style="display:none"> <select name="begin_type" onchange="changeSel(this)" > <option value=">">大于</option> <option value=">=">大于等于</option> <option value="=">等于</option> </select> </textarea> <textarea id="td2" style="display:none"> <input type="text" name="begin" /> </textarea> <textarea id="td3" style="display:none"> <select name="end_type"> <option value="<">小于</option> <option value="<=">小于等于</option> <option value="=">等于</option> </select> </textarea> <textarea id="td4" style="display:none"> <input type="text" name="end"/> </textarea> </body> </html>
var data = "{'txm':'06945174702517','mc':'青霉素','jx':'250mg*12片','gg':'规格','dw':'盒','zgjg':'50.0'}"; //自定义方法 function addRows(table_id,data){ var rows=$("#"+table_id); var vNum=$("#"+table_id+" tr").size(); var tr_Num = vNum - 1; var tr = handleData(data,tr_Num); $(tr).insertAfter($("#"+table_id+" tr:eq("+tr_Num+")")); } function handleData(data,tr_Num){ var obj = eval("("+data+")"); var tr = "<tr>"; tr += '<td height="28" align="center" valign="middle" bgcolor="#FFFFFF" ><input type="checkbox" id="ck_'+tr_Num+'" name="ck_'+tr_Num+'"/></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" ><input type="text" name="textfield" class="nkk" style=" 100px; height: 20px;" value="'+obj["txm"]+'" /></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" ><input type="text" name="textfield" class="nkk" style=" 140px; height: 20px;" value="'+obj["mc"]+'" /></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" ><input type="text" name="textfield" class="nkk" style=" 80px; height: 20px;" value="'+obj["jx"]+'" /></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" class="hei_12px"><input type="text" name="textfield10" class="nkk" style=" 50px; height: 20px;" value="'+obj["gg"]+'" /></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" class="hei_12px"><input type="text" name="textfield10" class="nkk" style=" 50px; height: 20px;" value="'+obj["dw"]+'" /></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" class="hei_12px"><input name="jg" type="text" class="nkk" style="50px; height:20px" value="'+obj["zgjg"]+'"/></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" ><input name="xsjg" type="text" class="nkk" style="80px; height:20px" value=""/></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" ></td>'; tr += '<td align="center" valign="middle" bgcolor="#FFFFFF" ><input type="text" name="textfield3" class="nkk" style=" 80px; height: 20px;" value="" /></td>'; tr += '</tr>'; return tr; }