Jquery 单击webgrid中的事件处理程序不工作

我正在用WebGrid实现CRUD操作。我跟踪了链接

下面是WebGrid人口的代码

@{ 
WebGrid grid = new WebGrid(Model, ajaxUpdateContainerId: "ajaxgrid",
                           rowsPerPage: 30);
}
<div id="divmsg" style="color: green; font-weight: bold"></div>
<a href="#" class="add">Add New</a>
<br />
<br />
@grid.GetHtml(
    tableStyle: "webgrid-table",
    headerStyle: "webgrid-header",
    footerStyle: "webgrid-footer",
    alternatingRowStyle: "webgrid-alternating-row",
    selectedRowStyle: "webgrid-selected-row",
    rowStyle: "webgrid-row-style",
    htmlAttributes: new { id = "grid" },
    fillEmptyRows: false,
    mode: WebGridPagerModes.All,
    firstText: "<< First",
    previousText: "< Prev",
    nextText: "Next >",
    lastText: "Last >>",
    columns: new[] {
        grid.Column(header: "Date",format: @<span> <span id="spanDate_@item.ID">@item.Date.ToString("yyyy-MM-dd")</span>     @Html.TextBox("Name_"+(int)item.ID,(string)item.Date.ToString("yyyy-MM-dd"),new{@style="display:none", @class="date-picker"})</span>),
        grid.Column(header: "Team",format: @<span> <span id="spanTeam_@item.ID">@item.Team</span> @Html.TextBox("Team_"+(int)item.ID,(string)item.Team,new{@style="display:none"})</span>),
        grid.Column(header: "Name",format: @<span> <span id="spanName_@item.ID">@item.Name</span> @Html.TextBox("Name_"+(int)item.ID,(string)item.Name,new{@style="display:none"})</span>),
        grid.Column(header: "Emp ID",format: @<span> <span id="spanEmp_ID_@item.ID">@item.Emp_ID</span> @Html.TextBox("Emp_ID_"+(int)item.ID,(int?)item.Emp_ID,new{@style="display:none"})</span>),
        grid.Column(header: "Voucher Count",format: @<span> <span id="spanVoucher_Cnt_@item.ID">@item.Voucher_count</span> @Html.TextBox("Voucher_Count_"+(int)item.ID,(int?)item.Voucher_count,new{@style="display:none"})</span>),
        grid.Column(header: "INC Created",format: @<span> <span id="spanINC_Created_@item.ID">@item.INC_Created</span> @Html.TextBox("INC_created_"+(int)item.ID,(int?)item.INC_Created,new{@style="display:none"})</span>),
        grid.Column(header: "INC Updated",format: @<span> <span id="spanINC_Updated_@item.ID">@item.INC_Updated</span> @Html.TextBox("INC_Updated_"+(int)item.ID,(int?)item.INC_Updated,new{@style="display:none"})</span>),
        grid.Column(header: "INC_Closed",format: @<span> <span id="spanINC_Closed_@item.ID">@item.INC_Closed</span> @Html.TextBox("INC_Closed_"+(int)item.ID,(int?)item.INC_Closed,new{@style="display:none"})</span>),
        grid.Column(header: "Planned Leave",format: @<span> <span id="spanPlannedLeave_@item.ID">@item.PlannedLeave</span> @Html.TextBox("PlannedLeave_"+(int)item.ID,(int?)item.PlannedLeave,new{@style="display:none"})</span>),
        grid.Column(header: "Unplanned Leave",format: @<span> <span id="spanUnplannedLeave_@item.ID">@item.UnplannedLeave</span> @Html.TextBox("UnplannedLeave_"+(int)item.ID,(int?)item.UnplannedLeave,new{@style="display:none"})</span>),
        grid.Column(header: "Emergency Leave",format: @<span> <span id="spanEmergencyLeave_@item.ID">@item.EmergencyLeave</span> @Html.TextBox("EmergencyLeave_"+(int)item.ID,(int?)item.EmergencyLeave,new{@style="display:none"})</span>),
        grid.Column(header: "Available",format: @<span> <span id="spanAvailable_@item.ID">@item.Available</span> @Html.TextBox("Available_"+(int)item.ID,(int?)item.Available,new{@style="display:none"})</span>),
        grid.Column(header: "Error Critical",format: @<span> <span id="spanError_Critical_@item.ID">@item.Error_Critical</span> @Html.TextBox("Error_Critical_"+(int)item.ID,(int?)item.Error_Critical,new{@style="display:none"})</span>),
        grid.Column(header: "Error Significant",format: @<span> <span id="spanError_Significante_@item.ID">@item.Error_Significant</span> @Html.TextBox("Error_Significant_"+(int)item.ID,(int?)item.Error_Significant,new{@style="display:none"})</span>),
        grid.Column(header: "Error Standard",format: @<span> <span id="spanError_Standard_@item.ID">@item.Error_Standard</span> @Html.TextBox("Error_Standard_"+(int)item.ID,(int?)item.Error_Standard,new{@style="display:none"})</span>),
        grid.Column(header: "Action",format:@<text> <a href="#" id="Edit_@item.ID" class="edit">Edit</a><a href="#" id="Update_@item.ID" style="display:none" class="update">Update</a><a href="#" id="Cancel_@item.ID" style="display:none" class="cancel">Cancel</a><a href="#" id="Delete_@item.ID" class="delete">Delete</a></text>)
    })

问题：当我在动态添加的行上单击“保存”链接时，它不会触发

$（“.Save”）。在（“单击”上，上面的函数（）{

，没有错误。我尝试放置相同的保存链接

<a href="#" id="' + Save + '" class="save">Save</a>

---

在grid.column（“Actions”）中，它在那里工作。不确定问题出在哪里。请在使用以下语法时提供帮助。

$(".save").on("click", function () {
    ...
    ...
});

单击

事件处理程序将仅处理呈现页面时存在的具有

class=“save”

的元素，但不会处理具有

class=“save”

的动态添加元素

添加新行时，需要使用在动态添加的保存链接上附加

单击
事件处理程序。因为在
grid.GetHtml
语法中有此选项

@grid.GetHtml(
    ...
    ...
    htmlAttributes: new { id = "grid" }

生成的
将具有
id=“grid”
属性，因此您可以使用
grid
作为保存链接容器的id。从此更改单击事件处理程序语法

$(".save").on("click", function () {
    ...
    ...
});

对此

$('#grid').on('click','.save', function() {
    ...
    ...
});

回答得好。效果很好！！为压力感到抱歉，我删除了我的评论。另外，是否可以在添加的新行中提供dropdownlist？我尝试了这个['@Html.dropdownlist（“Team”，（IEnumerable）ViewBag.Teams，“””），它在[']上写着“未捕获的SyntaxError:无效或意外令牌”。提前谢谢！我问了一个新问题。谢谢！
$(".save").on("click", function () {
    ...
    ...
});

$('#grid').on('click','.save', function() {
    ...
    ...
});