java模态框里怎么创建表格_模态对话框实现增加删除表格里面的内容

Title

.hide{

display:none;

}

.modal{

position: fixed;

top: 50%;

left: 50%;

width: 500px;

height: 400px;

margin:-250px 0 0 -250px ;

background-color: #1d9ad6;

z-index: 10;

}

.shadow{

position: fixed;

background-color: black;

top: 0;

left: 0;

right: 0;

bottom: 0;

opacity: 0.6;

z-index: 9;

}

添加

1.1.1.1..1	123123	123123	编辑|删除
1.1.1.1..2	123123	123123	编辑|删除
1.1.1.1..3	123123	123123	编辑|删除
1.1.1.1..4	123123	123123	编辑|删除
1.1.1.1..5	123123	123123	编辑|删除

$('.del').click(function(){

$(this).parent().parent().remove();

});

$("#i1").click(function () {

$('.modal,.shadow').removeClass('hide');

});

$('input[value="取消"]').click(function () {

$('.modal,.shadow').addClass('hide');

$('.modal input[name="hostname"]').val('');

$('.modal input[name="port"]').val('');

$('.modal input[name="ip"]').val('');

});

$('.edit').click(function () {

$('.modal,.shadow').removeClass('hide');

var tds = $(this).parent().prevAll();

// var host = $(tds[2]).text();

// var port = $(tds[1]).text();

// var ip = $(tds[0]).text();

// $('.modal input[name="hostname"]').val(host);

// $('.modal input[name="port"]').val(port);

// $('.modal input[name="ip"]').val(ip);

tds.each(function(){

var n =$(this).attr('target');

var text =$(this).text();

var a1 = '.modal input[name="';

var a2 = '"]';

// $('modal input[name=n]').val(text); #错误写法，因为$('x')为字符串，不能把变量加进去

var temp= a1+n+a2;

$(temp).val(text);

// })

// var port = $(this).parent.prevAll()(1).text();

// var ip = $(this).parent.prevAll()(0).text();

})})

$('input[value="确定"]').click(function () {

var tr = document.createElement('tr');

var td1 = document.createElement('td');

td1.innerHTML = "11.11.11.11";

var td2 = document.createElement('td');

td2.innerHTML = "8001";

$(tr).append(td1);

$(tr).append(td2);

$('#tb').append(tr);

$(".modal,.shadow").addClass('hide');

})