0

为我们的呼叫中心开发一个 MVC 3 应用程序，以显示保险单持有人的数据。

我有一个页面，其中包含在数据表中排序的保险索赔。表脚本是：

$('#claims').dataTable({
        "bProcessing": true,
        "bJQueryUI": true,
        "bPaginate": true,
        "bSort": false,
        "sPaginationType": "full_numbers",
        "sDom": '<"H"lrp>t<"F"ip>',
        "iDisplayLength": 10,
        "bAutoWidth": false,
        "oLanguage": { "sZeroRecords": "No claims found for this policy", 
                       "sProcessing": "<img src='../../../../Content/images/ajax-loader-bar.gif' />" },
        "aoColumns": [
            { "sName": "Claim #" },
            { "sName": "Status" },
            { "sName": "Clm Type" },
            { "sName": "Rider Form" },
            { "sName": "Primary DX" },
            { "sName": "Exam Code" },
            { "sName": "Asst Exam" },
            { "sName": "Case Mgr" },
            { "sName": "Follow Up Date" },
            { "sName": "Close/Deny Date" },
            { "sName": "Closed Reason" }
        ]

    });

其中一行包含一个按钮，该按钮可打开一个对话框窗口，其中包含有关该声明的详细信息。javascript是这样的：

$(function () {

        $('#ClaimsDetailDialog').dialog({
            autoOpen: false,
            width: 950,
            resizable: true,
            modal: true,
            position: ['center', 'top']
        });

        $('.claimmodal').on("click", function () {
            var url = $(this).attr('href');
            var claimnum = $(this).text();
            var policynum = $(this).attr('polnum');
            $('#ClaimsDetailDialog').html("<img src='../../../../Content/images/ajax-loader-bar.gif' />")
                .dialog("option", "title", "Claim Details for Claim #" + claimnum + " for Policy #" + policynum)
                .dialog("option", "buttons", {
                    Close: function () {
                        $(this).dialog("close");
                    }
                })
                .load(url).dialog("open");
            return false;
        });
    });

这工作正常，直到有超过 10 项针对保单的索赔。用户单击第二页后，单击索赔编号不再打开对话框，而是打开请求 URL 的窗口，没有 javascript 标记。

这是相关单元格的剃刀：

<td style="text-align: center">
    @Html.ActionLink(@item.Claimmast.CLMNO.ToString(), "ClaimDetail", null, new { id = item.Claimmast.ID }, new { @class = "claimmodal", polnum = item.Claimmast.POLICY }) 
</td>
4

1 回答 1

1

您需要使用委托，因为您正在动态更改 dom..

$('#claims').on('click','.claimmodal',function(){
    // your code here
});

取决于您使用的 jQuery 版本

$(selector).live(events, data, handler);                // jQuery 1.3+
$(document).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(document).on(events, selector, data, handler);        // jQuery 1.7+
于 2012-09-28T13:37:00.807 回答