Javascript Jquery:最近的（）行删除不工作

我有一个脚本，它添加了一组行，允许您在SharePoint列表表单中捕获其他访问者的信息。我有两个锚定标签，一个用于添加，另一个用于删除。当我添加一个新的访问者时，它可以工作，当我删除访问者时，它仍然可以工作，但是如果我再次尝试添加，它会返回以前删除的行和新添加的行。有人知道我如何解决这个问题吗

我编写的脚本和源代码：

function addVisitor(sender) {
    var newVisitor = "<tr class='newVisitor'><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' ><nobr>Visitor name</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text'  maxlength='255'  title='Visitor name' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' ><nobr>Visitor surname</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text'  maxlength='255'  title='Visitor surname' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' id='Visitor_x0020_email'><nobr>Visitor email*</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text' value='' maxlength='255'  title='Visitor email Required Field' style='ime-mode : ' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr style='display:none;' class='vReg'><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' id='Vehicle_x0020_registration'><nobr>Vehicle registration</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text' value='' maxlength='255' title='Vehicle registration' style='ime-mode : ' class='ms-long ms-spellcheck-true'><br></span></td>" + addBtn + "</tr>";

    $(newVisitor).insertAfter(sender);
if (hideReg)
    $('.vReg').hide();
else
    $('.vReg').show();

$('.add').on('click', function () {
    var sender = $(this).closest('tr')[0];
    $(this).hide();
    addVisitor(sender);
    $('.add').hide();
    $('.add:last').show();

});

$('.remove').on('click', function () {
    var sender = $(this).closest('tr')[0];
    $(this).hide();
    $('.add').hide();
    removeVisitor(sender);
    $('.add:last').show();
});

}

function removeVisitor(sender) {
    var rowPos = $(sender).index();
    $(sender).remove(); // remove current
   // $('.ms-formtable tr').eq(rowPos - 1);
    for (var i = 1; i<=4; i++) {
        $($('.ms-formtable tr')[rowPos - i]).remove();
    }      

}

函数addVisitor（发送者）{
var newVisitor=“访客姓名
访客姓氏
访客电子邮件*
车辆注册
”+addBtn+”；
$（newVisitor）.insertAfter（发送者）；
如果（隐藏）
$（'.vReg'）.hide（）；
其他的
$（'.vReg'）.show（）；
$（'.add'）。在（'click'，函数（）{
var sender=$（this）.closest（'tr'）[0]；
$（this.hide（）；
addVisitor（发送者）；
$（'.add'）.hide（）；
$（'.add:last'）.show（）；
});
$（'.remove'）。在（'click'，函数（）{
var sender=$（this）.closest（'tr'）[0]；
$（this.hide（）；
$（'.add'）.hide（）；
移除访客（发送者）；
$（'.add:last'）.show（）；
});
}
函数removeVisitor（发送者）{
var rowPos=$（发送方）.index（）；
$（发件人）.remove（）；//删除当前
//$（'.ms formtable tr'）.eq（行位置-1）；
对于（var i=1；i您应该将事件附件移出
addVisitor
方法

$('.remove').on('click', function () { ... }

及

如果没有，应用程序将有错误行为，因为每次代码调用方法
addVisitor
，它都会向事件添加一个新的处理程序，当用户单击类为
.add
或
的元素时，会导致不止一次调用回调函数

因此产生的代码是：

function addVisitor(sender) {
    var newVisitor = "<tr class='newVisitor'><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' ><nobr>Visitor name</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text'  maxlength='255'  title='Visitor name' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' ><nobr>Visitor surname</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text'  maxlength='255'  title='Visitor surname' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' id='Visitor_x0020_email'><nobr>Visitor email*</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text' value='' maxlength='255'  title='Visitor email Required Field' style='ime-mode : ' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr style='display:none;' class='vReg'><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' id='Vehicle_x0020_registration'><nobr>Vehicle registration</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text' value='' maxlength='255' title='Vehicle registration' style='ime-mode : ' class='ms-long ms-spellcheck-true'><br></span></td>" + addBtn + "</tr>";

    $(newVisitor).insertAfter(sender);
    if (hideReg)
        $('.vReg').hide();
    else
        $('.vReg').show();       
}

function removeVisitor(sender) {
    var rowPos = $(sender).index();
    $(sender).remove(); // remove current
   // $('.ms-formtable tr').eq(rowPos - 1);
    for (var i = 1; i<=4; i++) {
        $($('.ms-formtable tr')[rowPos - i]).remove();
    }            
}


$('.add').on('click', function () {
    var sender = $(this).closest('tr')[0];
    $(this).hide();
    addVisitor(sender);
    $('.add').hide();
    $('.add:last').show();

});

$('.remove').on('click', function () {
    var sender = $(this).closest('tr')[0];
    $(this).hide();
    $('.add').hide();
    removeVisitor(sender);
    $('.add:last').show();
});

函数addVisitor（发送者）{
var newVisitor=“访客姓名
访客姓氏
访客电子邮件*
车辆注册
”+addBtn+”；
$（newVisitor）.insertAfter（发送者）；
如果（隐藏）
$（'.vReg'）.hide（）；
其他的
$（'.vReg'）.show（）；
}
函数removeVisitor（发送者）{
var rowPos=$（发送方）.index（）；
$（发件人）.remove（）；//删除当前
//$（'.ms formtable tr'）.eq（行位置-1）；
对于（var i=1；iCreate working fiddle测试数据并共享URL。然后我们可以检查。我认为当jQuery选择器尝试使用“$（this.closest（'tr'）[0]”时，这里不需要索引。我建议您提供完整的代码（HTML+JavaScript）进一步研究。@LZ_MSFT我更新了我问题的代码。@Hanif我删除了，谢谢。
function addVisitor(sender) {
    var newVisitor = "<tr class='newVisitor'><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' ><nobr>Visitor name</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text'  maxlength='255'  title='Visitor name' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' ><nobr>Visitor surname</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text'  maxlength='255'  title='Visitor surname' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' id='Visitor_x0020_email'><nobr>Visitor email*</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text' value='' maxlength='255'  title='Visitor email Required Field' style='ime-mode : ' class='ms-long ms-spellcheck-true'><br></span></td></tr><tr style='display:none;' class='vReg'><td nowrap='true' valign='top' width='113px' class='ms-formlabel'><span class='ms-h3 ms-standardheader' id='Vehicle_x0020_registration'><nobr>Vehicle registration</nobr></span></td><td valign='top' width='350px' class='ms-formbody'><span dir='none'><input type='text' value='' maxlength='255' title='Vehicle registration' style='ime-mode : ' class='ms-long ms-spellcheck-true'><br></span></td>" + addBtn + "</tr>";

    $(newVisitor).insertAfter(sender);
    if (hideReg)
        $('.vReg').hide();
    else
        $('.vReg').show();       
}

function removeVisitor(sender) {
    var rowPos = $(sender).index();
    $(sender).remove(); // remove current
   // $('.ms-formtable tr').eq(rowPos - 1);
    for (var i = 1; i<=4; i++) {
        $($('.ms-formtable tr')[rowPos - i]).remove();
    }            
}


$('.add').on('click', function () {
    var sender = $(this).closest('tr')[0];
    $(this).hide();
    addVisitor(sender);
    $('.add').hide();
    $('.add:last').show();

});

$('.remove').on('click', function () {
    var sender = $(this).closest('tr')[0];
    $(this).hide();
    $('.add').hide();
    removeVisitor(sender);
    $('.add:last').show();
});