Jquery each（）在每个元素上循环不止一次

在我的项目中，我有一个表，我想按按钮从中删除特定的行。每行应具有一个

名称

属性，该属性具有表示该行的唯一索引。这用作使用MVC4的ViewModel与服务器的连接。要传输到服务器，它必须连续编号，包括所有名称。假设它必须有一个索引。如果现在在客户端删除一行，索引不会自动断开。为此，我现在编写了两个jquery函数来修改索引。但是，我有一个问题，即调用索引较高的每个元素作为已删除元素的方法会被多次调用。为什么

.each（）

方法的每个元素都被多次调用？是否有可能简化此代码

以下是jquery方法：

$(function(){
        $('.DeleteButton').click(function () {
            var deletedindex = getIndex(this.name, "DeleteSomething[", "]");
            this.parentNode.parentNode.remove();
            renumberEntry(1, deletedindex);
        });
});
    function renumberEntry(valueToSub, deletedindex) {
        $('#SomethingTableBody > tr > td > .SomethingTableClass').each(function (index, element) {
            element.name = replaceIndexNumber(element.name, "Somethings[", "]", valueToSub, deletedindex);
        });
        $('#SomethingsTableBody > tr > td > .field-validation-valid').each(function (index, element) {
            $(this).attr('data-valmsg-for', replaceIndexNumber($(this).attr('data-valmsg-for'), "Somethings[", "]", valueToSub, deletedindex));
        });
    };
    function replaceIndexNumber(originalText, prefix, suffix, valueToSub, deletedindex) {
        var prefixLength = prefix.length;
        if (originalText.substr(0, prefixLength) == prefix) {
            var index = originalText.indexOf(suffix);
            if (index >= prefixLength) {
                var oldValue = parseInt(originalText.substring(prefixLength, index));
                if (deletedindex < oldValue) {
                    return originalText.substr(0, prefixLength) + (oldValue - valueToSub) + originalText.substr(index);
                }
            }
        }
        return originalText;
    };
    function getIndex(originalText, prefix, suffix) {
        var prefixLength = prefix.length;
        if (originalText.substr(0, prefixLength) == prefix) {
            var index = originalText.indexOf(suffix);
            if (index >= prefixLength) {
                return parseInt(originalText.substring(prefixLength, index));
            }
        }
        return 0;
    };

$（函数（）{
$（'.DeleteButton'）。单击（函数（）{
var deletedindex=getIndex（this.name，“DeleteSomething[”，“]”）；
this.parentNode.parentNode.remove（）；
重新编号条目（1，删除索引）；
});
});
函数重新编号条目（valueToSub，deletedindex）{
$（'#SomethingTableBody>tr>td>.SomethingTableClass'）。每个（函数（索引，元素）{
element.name=replaceIndexNumber（element.name，“Somethings[”，“]”，valueToSub，deletedindex）；
});
$（“#SomethingsTableBody>tr>td>。字段验证有效”）。每个（函数（索引，元素）{
$（this.attr（'data-valmsg-for'，replaceIndexNumber（$（this.attr（'data-valmsg-for'）），“Somethings[”，“]”，valueToSub，deletedindex））；
});
};
函数replaceIndexNumber（原始文本、前缀、后缀、valueToSub、deletedindex）{
var prefixLength=prefix.length；
if（originalText.substr（0，前缀长度）=前缀）{
var索引=原始文本索引（后缀）；
如果（索引>=前置桥长度）{
var oldValue=parseInt（originalText.substring（前缀长度，索引））；
if（deletedindex=前置桥长度）{
返回parseInt（originalText.substring（前缀长度，索引））；
}
}
返回0；
};

下面是视图的一些细节：

                <table id="SomethingsTable">
                    <thead>
                        <tr>
                            <th>@Html.Label("ID")</th>
                            <th>@Html.Label("Type")</th>
                            <th>@Html.Label("Synonym")</th>
                                                 <th></th>
                        </tr>
                    </thead>
                    <tbody id="SomethingsTableBody">
                        @Html.EditorFor(x => x.Somethings)
                    </tbody>
                </table>

@Html.Label（“ID”）
@Html.Label（“类型”）
@Html.Label（“同义词”）
@EditorFor（x=>x.Somethings）

下面是编辑器模板：

@{
    Layout = null;
}
@model EditSomethingModel

<tr>
    <td>@Html.TextBoxFor(m=>m.SomethingID, new {@class="SomethingTableClass"</td>
       <td>@Html.DropDownListFor(m => m.SomethingType.ID, new SelectList(ViewBag.SomethingTypeList, "ID", "Name", Model.SomethingType.ID), new { id = "SomethingTypeList" + @Model.ID + "", Name = "Somethings[" + ViewBag.ListId + "].SomethingType.ID", @class = "SomethingTableClass" })<span class="field-validation-valid" data-valmsg-for="Somethings[@ViewBag.ListId].SomethingType.ID" data-valmsg-replace="true"></span></td>
    <td>@Html.DropDownListFor(m => m.MainSomethingSynonymId, new SelectList(ViewBag.SomethingSynonymList, "ID", "Name", Model.MainSomethingSynonymId), new { id = "MainSomethingSynonymList" + @Model.ID + "", @class = "SomethingSynonymList SomethingTableClass", Name = "Somethings[" + ViewBag.ListId + "].MainSomethingSynonymId" })<span class="field-validation-valid" data-valmsg-for="Somethings[@ViewBag.ListId].MainSomethingSynonymId" data-valmsg-replace="true"></span>
           </td>
    <td>
        <input type="button" name="DeleteSomething[@ViewBag.ListId] " value="Delete" class="DeleteButton" id="DeleteSomethingButton_@Model.ID" ></td>
</tr>

@{
布局=空；
}
@模型编辑某物模型
@Html.TextBoxFor（m=>m.SomethingID，new{@class=“SomethingTableClass”
@Html.DropDownListFor（m=>m.SomethingType.ID，new SelectList（ViewBag.SomethingType列表，“ID”，“Name”，Model.SomethingType.ID），new{ID=“SomethingType列表”+@Model.ID+”，Name=“something[“+ViewBag.ListId+”].SomethingType.ID”，@class=“SomethingTableClass”}）
@Html.DropDownListFor（m=>m.MainSomethingSynonymId，new SelectList（ViewBag.something同义词列表，“ID”，“Name”，Model.MainSomethingSynonymId），new{ID=“MainSomethingSynonymList”+@Model.ID+”，@class=“something同义词列表SomethingTableClass”，Name=“something[“+ViewBag.ListId+”].MainSomethingSynonymId”}）

解决了这个问题。我在jquery代码中的错误点上搜索了错误。 问题是，每次我将新元素加载到表中时，动态生成的按钮都会得到一个新的单击事件。我通过从按钮中解除所有单击事件的绑定并为它们提供新事件来更改它

在我关于成功的ajax呼吁中：

$('#SomethingTable tr:last').after(html);
                    var table = $('#NeSomethingForm').removeData("validator").removeData("unobtrusiveValidation");
                    $.validator.unobtrusive.parse(table);
                    $('.DeleteButton').on('click', function () {
                        var deletedindex = getIndex(this.name, "DeleteSomething[", "]");
                        this.parentNode.parentNode.remove();
                        renumberEntry(1, deletedindex);
                    });

现在：

$('#SomethingTable tr:last').after(html);
                    var table = $('#NeSomethingForm').removeData("validator").removeData("unobtrusiveValidation");
                    $.validator.unobtrusive.parse(table);
                    $(".DeleteButton").unbind("click"); // <-- new line to unbind the events before
                    $('.DeleteButton').on('click', function () {
                        var deletedindex = getIndex(this.name, "DeleteSomething[", "]");
                        this.parentNode.parentNode.remove();
                        renumberEntry(1, deletedindex);
                    });

$（'SomethingTable tr:last'）。在（html）之后；
var表=$（“#NeSomethingForm”）.removeData（“验证器”）.removeData（“不引人注目的验证”）；
$.validator.unobtrusive.parse（表）；
$（“.DeleteButton”）.unbind（“单击”）；/“调用了什么方法？”googleübersetzer ftw！：我有点匆忙，所以我想帮你摆脱我糟糕的英语。我想这次尝试失败了。^。我现在在没有谷歌翻译的情况下对文本进行了过度阅读。希望现在可以理解。对不起。你能制作一个具有适当的MVC生成HTML的版本吗？这样可以更容易地看到问题并创建一个解决方案