通過Ajax調用加載元素后，On Click事件不起作用

Question

我正在加載頁面（包含javascript），然后正在加載PartialView（包含表）。 問題是，我無法選擇表ID或onClick事件不會觸發。

Index.cshtml

$('#sortingRow').on('click', 'th a', function () {
    $.ajax({
        url: this.href,
        type: 'GET',
        data: { sortOrder: sortOrder },
        success: function (result) {
            $('#sortingRow').parent().html(result);
            LoadSampleDesign();
        }
    });
    return false;
});

_PartialView.cshtml

<table>
    <tr id="sortingRow">
        <th>
            <a href="link">Click Me</a>
        </th>
    </tr>
</table>

該PartialView是使用Ajax加載的，如下所示：

$(sections).on('click', '#sectionPageLinks a', function () {
    $.ajax({
        url: this.href,
        type: 'GET',
        success: function (result) {
            $('#sectionPageLinks').parent().html(result);
            LoadSampleDesign();
        }
    });
    return false;
});

我嘗試了JsFiddle，JavaScript似乎正常工作。 另外，起初，您可能會認為問題在於jquery因為在DOM完成之后就被加載而無法找到該表，所以這就是為什么我使用“ on（）”的原因，並不能使它生效即使在DOM完成之后也應該能夠找到#table。

Answer 1

通過Ajax加載部分視圖后，不再綁定click事件。 如下更改行單擊事件。

$('#sortingRow').on('click', 'th a', function () {

$(document).on('click', '#sortingRow th a', function () {