jquery、CSS控制表格常用操作（2）

选中表格几行，点击按钮添加到另一表格。

效果图：

function ifchecked() {
  var a = $("input[name='cashbagSaveYN']")
  var n = a.length
  var b = new Array()
  var c = new Array()
  var num = 0
  for (var i = 0; i < n; i++) {
    if (a[i].checked) {
      var v = a[i]
      var $v = $(v); //将a[i]转化为jquery对象，才能使用parent()方法
      var nnn = $(v).parent().siblings()
      for (var m1 = 0; m1 < 4; m1++) {
        var $z = $(nnn[m1])
        var mmm = $z.text()
        // alert(mmm)       
        c.push(mmm)
      }
      b.push(c)
      num++
    }
  }
  var table3 = document.getElementById('table3')
  for (var i = 0; i < num; i++) {
    var onRow = table3.insertRow()
    for (var j = 0; j < 4; j++) {
      var cell = onRow.insertCell()
      cell.innerHTML = b[i][j]
      // alert(cell.innerHTML)
    }
    var cell = onRow.insertCell()
    cell.innerHTML = "<input value='x' type='button' onclick='deleteRow(this)'>"
  }
}

使用insertRow()，insertCell()方法给边上的table插入新行和新单元。使用text()方法获取当前表格选中td的内容，存到二维数组b[][]中。然后赋值给新增单元格的innerHTML。

删除表格指定行。

(效果图如上右边表格，点击对应按钮删除指定行)

js:

function deleteRow(r) {
  var i = r.parentNode.parentNode.rowIndex //获取指定行行号
  table3.deleteRow(i)
}

html:

(按钮绑定deleteRow(this)方法）

<input value='x' type='button' onclick='deleteRow(this)'>//this返回当前按钮

在表格内部设置滚动条

        #table3 tbody {
            height: 300px;
            overflow: scroll;
            display: block;
            width: 375px;
        }

tbody设置指定高度，设置display:block;overflow:scroll;