bootstrap table实现双击可编辑、添加、删除行功能

bootstrap table实现双击可编辑、添加、删除行功能

本文实例为大家分享了bootstrap table双击可编辑的具体代码，供大家参考，具体内容如下

html：

删除

添加

js：

function save_para_table(){

var tableinfo = gettableinfo();

alert(tableinfo);

}

//get table infomation

function gettableinfo(){

var key = "";

var value = "";

var tabledata = "";

var table = $("#para_table");

var tbody = table.children();

var trs = tbody.children();

for(var i=1;i

var tds = trs.eq(i).children();

for(var j=0;j

if(j==0){

if(tds.eq(j).text()==null||tds.eq(j).text()==""){

return null;

}

key = "key\":\""+tds.eq(j).text();

}

if(j==1){

if(tds.eq(j).text()==null||tds.eq(j).text()==""){

return null;

}

value = "value\":\""+tds.eq(j).text();

}

}

if(i==trs.length-1){

tabledata += "{\""+key+"\",\""+value+"\"}";

}else{

tabledata += "{\""+key+"\",http://\""+value+"\"},";

}

}

tabledata = "["+tabledata+"]";

return tabledata;

}

function tdclick(tdobject){

var td=$(tdobject);

td.attr("onclick", "");

//1,取出当前td中的文本内容保存起来

var text=td.text();

//2,清空td里面的内容

td.html(""); //也可以用td.empty();

//3，建立一个文本框，也就是input的元素节点

var input=$("");

//4，设置文本框的值是保存起来的文本内容

input.attr("value",text);

input.bind("blur",function(){

var inputnode=$(this);

var inputtext=inputnode.val();

var tdNode=inputnode.parent();

tdNode.html(inputtext);

tdNode.click(tdclick);

td.attr("onclick", "tdclick(this)");

});

input.keyup(function(event){

var myEvent =event||window.event;

var kcode=myEvent.keyCode;

if(kcode==13){

var inputnode=$(this);

var inputtext=inputnode.val();

var tdNode=inputnode.parent();

tdNode.html(inputtext);

tdNode.click(tdclick);

}

});

//5，将文本框加入到td中

td.append(input);

var t =input.val();

input.val("").focus().val(t);

// input.focus();

//6,清除点击事件

td.unbind("click");

}

function addtr(){

var table = $("#para_table");

var tr= $("

"

"

"

table.append(tr);

}

function deletetr(tdobject){

var td=$(tdobject);

td.parents("tr").remove();

}

var tds = trs.eq(i).children();

for(var j=0;j

if(j==0){

if(tds.eq(j).text()==null||tds.eq(j).text()==""){

return null;

}

key = "key\":\""+tds.eq(j).text();

}

if(j==1){

if(tds.eq(j).text()==null||tds.eq(j).text()==""){

return null;

}

value = "value\":\""+tds.eq(j).text();

}

}

if(i==trs.length-1){

tabledata += "{\""+key+"\",\""+value+"\"}";

}else{

tabledata += "{\""+key+"\",http://\""+value+"\"},";

}

}

tabledata = "["+tabledata+"]";

return tabledata;

}

function tdclick(tdobject){

var td=$(tdobject);

td.attr("onclick", "");

//1,取出当前td中的文本内容保存起来

var text=td.text();

//2,清空td里面的内容

td.html(""); //也可以用td.empty();

//3，建立一个文本框，也就是input的元素节点

var input=$("");

//4，设置文本框的值是保存起来的文本内容

input.attr("value",text);

input.bind("blur",function(){

var inputnode=$(this);

var inputtext=inputnode.val();

var tdNode=inputnode.parent();

tdNode.html(inputtext);

tdNode.click(tdclick);

td.attr("onclick", "tdclick(this)");

});

input.keyup(function(event){

var myEvent =event||window.event;

var kcode=myEvent.keyCode;

if(kcode==13){

var inputnode=$(this);

var inputtext=inputnode.val();

var tdNode=inputnode.parent();

tdNode.html(inputtext);

tdNode.click(tdclick);

}

});

//5，将文本框加入到td中

td.append(input);

var t =input.val();

input.val("").focus().val(t);

// input.focus();

//6,清除点击事件

td.unbind("click");

}

function addtr(){

var table = $("#para_table");

var tr= $("

"

"

"

if(j==0){

if(tds.eq(j).text()==null||tds.eq(j).text()==""){

return null;

}

key = "key\":\""+tds.eq(j).text();

}

if(j==1){

if(tds.eq(j).text()==null||tds.eq(j).text()==""){

return null;

}

value = "value\":\""+tds.eq(j).text();

}

}

if(i==trs.length-1){

tabledata += "{\""+key+"\",\""+value+"\"}";

}else{

tabledata += "{\""+key+"\",http://\""+value+"\"},";

}

}

tabledata = "["+tabledata+"]";

return tabledata;

}

function tdclick(tdobject){

var td=$(tdobject);

td.attr("onclick", "");

//1,取出当前td中的文本内容保存起来

var text=td.text();

//2,清空td里面的内容

td.html(""); //也可以用td.empty();

//3，建立一个文本框，也就是input的元素节点

var input=$("");

//4，设置文本框的值是保存起来的文本内容

input.attr("value",text);

input.bind("blur",function(){

var inputnode=$(this);

var inputtext=inputnode.val();

var tdNode=inputnode.parent();

tdNode.html(inputtext);

tdNode.click(tdclick);

td.attr("onclick", "tdclick(this)");

});

input.keyup(function(event){

var myEvent =event||window.event;

var kcode=myEvent.keyCode;

if(kcode==13){

var inputnode=$(this);

var inputtext=inputnode.val();

var tdNode=inputnode.parent();

tdNode.html(inputtext);

tdNode.click(tdclick);

}

});

//5，将文本框加入到td中

td.append(input);

var t =input.val();

input.val("").focus().val(t);

// input.focus();

//6,清除点击事件

td.unbind("click");

}

function addtr(){

var table = $("#para_table");

var tr= $("

"

"

"

table.append(tr);

}

function deletetr(tdobject){

var td=$(tdobject);

td.parents("tr").remove();

}

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。