您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

jquery实现select选中行、列合计示例

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 Jquery 方法 

代码如下: $(  function () {    //页面加载时计算人员统计表合计值  calcSum();    });    //合计行计算  /*  以合计行为中间变量  每个单元格与该列合计行相加  得到每列合计  */  function trVisible(chk, index) {    var disValue = $("#Tr" + index).css("display");  if (chk.checked) {    $("#Tr" + index).css("display", "block");  }  else {  $("#Tr" + index).css("display", "none");  }  calcSum();  }  function calcSum() {    //合计行赋初始值0  $("#trSum").each(function () {  $(this).find("td").each(function () {  if ($(this).index() != 0) {  $(this).text("0");  }  });  });    $("#tabrytj").find("tr").each(function () {  var trDis = $(this).css("display");  //隐藏行不参与计算  if (trDis == "block") {  $(this).find("td").each(function () {  var index = $(this).index();  if (index >= 1) {  var tdValue = $("#trSum").find("td:eq(" + index + ")").text();  //totalSum += parseFloat($(this).text());  $("#trSum").find("td:eq(" + index + ")").text(parseFloat(tdValue) + parseFloat($(this).text()));  }  });  }  });      }    html语句  代码如下: <table>  <tr>  <td>分公司</td>  <td>  <select>  <option>  华南分公司  </option>  </select>  </td>  <td><input type="checkbox" onclick="trVisible(this,1)" name="chk1" id="chk1" checked="checked" />张1</td>  <td><input type="checkbox" onclick="trVisible(this,2)" checked="checked" />张2</td>  <td><input type="checkbox" onclick="trVisible(this,3)" checked="checked" />张3</td>  <td><input type="checkbox" onclick="trVisible(this,4)" checked="checked" />张4</td>  <td><input type="checkbox" onclick="trVisible(this,5)" checked="checked" />张5</td>  <td><input type="checkbox" onclick="trVisible(this,6)" checked="checked" />张6</td>  </tr>  </table>        <div>  <table border="0" class="tableinfo" id="tabrytj">  <tr id="Tr1" style="display:block">  <td>张1 </td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  </tr>  <tr id="Tr2" style="display:block">  <td>张2 </td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  </tr>  <tr id="Tr3" style="display:block">  <td>张23 </td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  <td>124536</td>  </tr>  <tr id="trSum">  <td></td>  <td>0</td>  <td>0</td>  <td>0</td>  <td>0</td>  <td>0</td>  <td>0</td>  <td>0</td>  <td>0</td>  <td>0</td>  <td>0</td>  </tr>  </table> </div>