0

在我的 MVC 应用程序中,我有一个表单,我进行了 2 个异步 AJAX 调用,1 个用于获取新的数据页面,另一个用于显示搜索结果。在这些调用之前表单的初始加载很好。我想给我的行着色,这很有效;

$("#tblePagedList").on("change", styleRows);

function styleRows() {
    $("#tblePagedList tr:even").addClass("row1");
    $("#tblePagedList tr:odd").addClass("row2");
}

但是,在我导航到新页面或进行搜索后,这些样式不会应用。我尝试连接更改事件失败了;

IE

$("#tblePagedList").on("change", styleRows);

或者

$("#tblePagedList").change(styleRows);

我的桌子看起来像;

<table id="tblePagedList">
    <thead>
        <tr>
            <th>
                Company
            </th>
            <th>
                Address
            </th>
            <th style="width:100px;">
                Telephone
            </th>
            <th style="width:100px;">
                Contact
            </th>
            <th style="width:100px;">
                Trade
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody id="tblePagedListBody"></tbody>
    @foreach (var item in Model) {
        <tr>
            <td>
                @item.Company
            </td>
            <td>
                @item.AddressLine
            </td>
            <td>
                @item.Telephone
            </td>
            <td>
                @item.Contact
            </td>
            <td>
                @item.TradeName
            </td>
            <td>
                @Html.ActionLink("Details", "DetailsSubcontractor", new { id = item.CompanyId })
            </td>
        </tr>
    }
4

1 回答 1

2

On Change 事件在输入值更改时触发,而不是在 DOM 更改时触发。如果您需要一个事件,我会注册一个自定义事件,我们称之为更新:

`$("#tblePagedList").on("update", handler)`

并在 AJAX 调用成功时手动触发:

`$("#tblePagedList").trigger("update")`

但我不确定你是否真的需要事件。也许调用styleRowsAJAX 回调就足够了?

如果你真的喜欢事件的概念,可以考虑切换到 BackboneJS。您可以将获取的数据存储在集合中,挂钩到集合更新事件并在该事件上呈现表。

顺便说一句,随后的两个styleRows调用可能会给出错误的结果,删除旧类:

函数样式行(){
    $("#tblePagedList tr:even").removeClass("row1 row2").addClass("row1");
    $("#tblePagedList tr:odd").removeClass("row1 row2").addClass("row2");
}
于 2012-12-17T10:38:21.740 回答