为什么jQuery live('click')只在带有AJAX分页的特定类的第一页上工作?

why is jQuery live('click') only working on first page for a specific class with AJAX paging?

本文关键字:分页 工作 AJAX 第一页 live jQuery click 为什么      更新时间:2023-09-26

我正在构建一个一次显示两个问题的问卷。

当我用类"MCQRadio"按下单选按钮时,一个点击处理程序被触发,但它只在第一页上工作。gradio的clickhandler适用于所有页面。

我做错了什么?

这是代码:

    <script language="javascript">
    $(document).ready(function()
    {
        $(".page-number").live("click", function()
        {
            var page = parseInt($(this).html());
            var progressbarValue = ((page / $("#NumberOfPages").val()) * 100);
            var catId = $("#CategoryID").val();
            $.ajax(
            {
                url: '@Url.Action("QuestionList")',
                data: {
                    "categoryId": catId,
                    "page": page
                },
                success: function(data)
                {
                    $("#question-list").html(data);
                    $("#progressbar").progressbar("value", progressbarValue);
                    $("#progresstext").html("<p>" + Math.round(progressbarValue) + "% gennemgået</p>");
                }
            });
        });
        $('.MCQRadio').click(function()
        {
            var button = $(this);
            var question_id = button.attr('question-id');
            var mcq_id = button.attr('mcq-id');
            $('#savingquestion').fadeIn();
            $.ajax(
            {
                url: '/SaveSurveyAnswers/SaveMCQAnswer',
                data: {
                    "mcq_id": mcq_id,
                    "question_id": question_id
                },
                success: function(data)
                {
                    button.parent().parent().attr('id', "answerswered");
                    $('#savingquestion').fadeOut();
                }
            });
        });
        $('.GridRadio').live('click', function()
        {
            var button = $(this);
            var row_id = button.attr('row-id');
            var column_id = button.attr('column-id');
            var question_id = button.attr('question-id');
            $('#savingquestion').fadeIn();
            $.ajax(
            {
                url: '/SaveSurveyAnswers/SaveGridAnswer',
                data: {
                    "row_id": row_id,
                    "column_id": column_id,
                    "question_id": question_id
                },
                success: function(data)
                {
                    // Hvis ActionControlleren returnerer complete, betyder det at spørgsmålet er fuldt besvaret.
                    // Hvis dette er tilfældet, skal id på den omringende table og div ændres, således at der kommer
                    // de rigtige farver for besvarede spørgsmål
                    $('#savingquestion').fadeOut();
                    if (data == "complete")
                    {
                        var table = button.closest('table');
                        var div = button.closest('div');
                        if (table.attr('id') != "answersweredTable")
                        {
                            table.attr('id', 'answeredTable');
                        }
                        if (div.attr('id') != "answerswered")
                        {
                            div.attr('id', 'answered');
                        }
                    }
                }
            });
        });
    });

也许是因为一个使用live而另一个不使用?

改变:

$('.MCQRadio').click(function() ...

:

$('.MCQRadio').live('click', function() ...

MCQRadio的功能不是实时功能,只是一个正常的点击功能。我猜它也应该是一个live函数。

$('.MCQRadio').click(function()

应为

$('.MCQRadio').live('click', function()