在第二個ajax調用jquery后無法正常工作

Question

我在asp.net mvc中通過ajax獲得了部分內容，第一次和第二次都可以正常工作，但是之后，它重定向到通過ajax獲取頁面的頁面instad。

這是我的部分頁面代碼：

<script>

    var jqgd = jQuery.noConflict();
    jqgd(function () {
        jqgd('#getdata-@ViewBag.term').on('click', 'a', function () {
            if (this.href == "") { return; }
            jqgd.ajax({
                url: this.href,
                type: 'GET',
                cache: false,
                success: function (result) {
                    alert(result);
                    jqgd('#retrieve-@ViewBag.term').html(result);
                }
            });
            return false;
        });
    });
</script>

<script type='text/javascript'> // Added
    jQuery(function ($) {

        $("div, p, a, b, strong, bold, font, span, td")
        .filter(function () {
            return $(this).children(":not(.word)").length == 0
        })
        .each(function () {
            this.innerHTML = $(this).text().replace(/\S+/g, function (word) {
                return "<span class='word'>" + word + "</span>";
            });

            $(".word", this).filter(isEnglish).addClass('english');
            $(".word", this).filter(isPersian).addClass('persian');
        });

        function isEnglish() {
            return $(this).text().charCodeAt(0) < 255;
        }

        function isPersian() {
            return $(this).text().charCodeAt(0) > 255;
        }
    });
</script>

<div id="retrieve-@ViewBag.term">
    <div style="float:right;">
        <div class="searchtitles" style="float: right;">@ViewBag.term</div>
        <table class="jjt" cellpadding="0" cellspacing="0">
            <tr class="j2t">
                <td class="j13t">field</td>
                <td class="j13t">field</td>
                <td class="j13t">field</td>
                <td class="j13t">field</td>
                <td class="j13t">field</td>
                <td class="j13t">field</td>
                <td class="j13t">field</td>
            </tr>
            @foreach (var item in ViewBag.Terms)
            {
                Mydata 
            }


        </table>

        <div id="getdata-@ViewBag.term" style="float:left; direction:ltr; margin-left:-20px; margin-top:-15px;">@Html.PagedListPager((IPagedList)ViewBag.Tours, page => Url.Action("results", new { page }))</div>
    </div>
</div>

我正在使用pagedlist，當我第二次更改頁面后，似乎所有的jQuery命令都終止了，這是什么問題？ 誰能幫我 ？

編輯 ：這部分代碼在第二次調用后也無法正常工作。

<script type='text/javascript'> // Added
        jQuery(function ($) {

            $("div, p, a, b, strong, bold, font, span, td")
            .filter(function () {
                return $(this).children(":not(.word)").length == 0
            })
            .each(function () {
                this.innerHTML = $(this).text().replace(/\S+/g, function (word) {
                    return "<span class='word'>" + word + "</span>";
                });

                $(".word", this).filter(isEnglish).addClass('english');
                $(".word", this).filter(isPersian).addClass('persian');
            });

            function isEnglish() {
                return $(this).text().charCodeAt(0) < 255;
            }

            function isPersian() {
                return $(this).text().charCodeAt(0) > 255;
            }
        });
    </script>

Answer 1

您的#getdata-@ViewBag.term在#retrieve-@ViewBag.term元素內，但在第一次調用后將被替換。 您需要使用事件委托。

嘗試以下方法：

jqgd('#retrieve-@ViewBag.term').on('click', '#getdata-@ViewBag.term a', function () {
    ...
}

Answer 2

這只是黑暗中的一槍：

從點擊處理程序中獲取e，然后嘗試e.preventDefault（）; 返回前為假。