【需求】:表单添加行,删除行,插入行
【代码】:
$(function () {
//定义一个全局变量i,用来标识添加了几行
var row = 0;
var strValue = "";
//将一行添加到table中去
$('#btnInsert').click(function () {
row++;
//字符串拼接tr一行中的内容
var tr = "<tr>";
for (var i = 0; i < 3; i++) {
tr += "<td><input id='" + row + "text'" + i + "+' type='text' value=" + row +""+ i + " /></td>";
}
tr += "<td><input class='txt' id='" + i + "text4'+ type='text' value=" + row + "" + 4 + " /><input id='Checkbox1' class='ck' name='ckb' type='checkbox' /> </td></tr>";
$("#tab").append(tr);
})
//删除添加的行,先判断checkbox是否选中,然后删除
$('#btnDelete').click(function () {
$("input[name=ckb]:checked").each(function () { $(this).parent().parent().remove(); });
})
//将i遍历,判断是否存有值,如果有将数据插入数据库
$('#btnData').click(function () {
$('table input').each(function () {
strValue += $(this).val() + ",";
})
$.ajax({
type: 'post',
contentType: 'application/json',
url: "../WebService1.asmx/InsertInfo",
data: "{valuesStr:'" + strValue + "'}",
success: function (result) {
$('#mydiv').html(result.d);
}
})
})
})
【转载】---------------------
原文:https://blog.csdn.net/yf505261213/article/details/11559719