后第二Ajax调用所有的jQuery codeS不工作 [英] after second ajax call all jquery codes not working

问题描述

我在通过asp.net的MVC阿贾克斯获得一个局部，它做工精细首次和第二次，但在那之后，所有的jQuery codeS停止工作。这是我的code：

I'm getting a partial via ajax in asp.net mvc, it work fine for first time and second time but after that, all jquery codes stop working. this is my code :

<script>

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

<script type='text/javascript'> //This function
    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="[e-mail]">
    <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="[e-mail]" 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>

code，我作为注释的一部分'的此功能'在code不起作用。同时我在布局中使用醉意弹出，这并不第二个电话后，工作。似乎所有我的jQuery codeS的停止第二个电话后，工作。

part of code that i comment as ' This function ' in code does not work. also I use tipsy popup in my layout, it does not work after second call. it seems all of my jquery codes stop working after second call.

是什么问题呢？

推荐答案

尝试这样的事情

    <script>
        var jqgd = jQuery.noConflict();
        jqgd(function () {
            jqgd('#[e-mail]').on('click', '#[e-mail] a', function () {
                if (this.href == "") { return; }
                jqgd.ajax({
                    url: this.href,
                    type: 'GET',
                    cache: false,
                    success: function (result) {
                        alert(result);
                        jqgd('#[e-mail]').html(result);
                        init();
                    }
                });
                return false;
            });
        });
    </script>

    <script type='text/javascript'> //This function
        function isEnglish() {
            return $(this).text().charCodeAt(0) < 255;
        }

        function isPersian() {
            return $(this).text().charCodeAt(0) > 255;
        }
        function init(){
         $("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');
            });

        }
        jQuery(function ($) {
            init();
        });
    </script>

简单地做出要执行你的code的作用。

Simply make function of your code that you want to execute.

由于这是在DOM present在DOM准备初始元素上的code运行。

Because your code run on initial element which are present in DOM on DOM ready.

阿贾克斯后，你会得到新的元素上code不跑那么把你的code函数，并调用它的DOM准备好和你的Ajax调用后。

After ajax you get new element on which code doesn't run so put your code in function and call it on DOM ready and after your ajax call.

这篇关于后第二Ajax调用所有的jQuery codeS不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！