Question

我的代码中有一个小问题。我有一个函数，它需要loadData AJAX页面。此结果将复选框放在我的页面上。（这没关系）

现在我想要点击一个复选框，执行AJAX请求就是更改数据库中的值（这也没关系。）

问题是：当我点击一个复选框（未选中）时，它会勾选并执行ajax，一旦执行了ajax，该框就会单独取消选中。

我做了几次测试，我意识到只有在Ajax请求中选中复选框时才会出现问题。

注意：我试图添加$（选择器）.attr（'checked'，true）和false，但没有任何效果。

Jquery（执行Ajax时问题出在loadData函数中，单击复选框取消选中）：

 $(document).ready(function()  {
    $('#TableContainer .RCkbox').live('click',function(){

        var idOperation = 550;
        if($(this).is(":checked")){

            $.ajax({
                type: "POST",
                url: "includes/ajax/OperationRapprochement.php",
                data: "sessionId=" + <?php echo $User->getId(); ?> + "&AccountNumber=" + <?php echo $compte->getId(); ?> + "&idOperation=" + idOperation + "&action=rapproche",
                success: function(msg)
                {
                    //TODO  

                }
            });
        }
        else{

                $.ajax({
                type: "POST",
                url: "includes/ajax/OperationRapprochement.php",
                data: "sessionId=" + <?php echo $User->getId(); ?> + "&AccountNumber=" + <?php echo $compte->getId(); ?> + "&idOperation=" + idOperation + "&action=derapproche",
                success: function(msg)
                {
                      //TODO

                }
            });
       }
    });


    function loadData(){
    $.ajax({
            type: "POST",
            url: "includes/ajax/test.php",
            data: "sessionId=" + <?php echo $User->getId(); ?> + "&AccountNumber=" + <?php echo $compte->getId(); ?>,
            success: function(msg){
                    $("#TableContainer").ajaxComplete(function(event, request, settings){
                           $("#TableContainer").html(msg);
                    });
            }
        });
    }

    loadData();
});

我制作视频向您展示行动中的问题：http://youtu.be/nG9XF2f4M18

感谢您的帮助。

Answer 1

**答案是根据我在评论中获得的信息更新**

我在您的文件中发现了问题。

问题是您使用事件“.ajaxComplete”。如果您正确阅读documentation，则表示每次进行ajax调用时都会调用该事件。

因此，当您单击复选框时进行ajax调用，当您收到结果时，loadData函数中的回调将再次被调用，这意味着它再次执行$("#TableContainer").html(msg); ...换句话说，它再次替换内容。这就是你丢失选中复选框的原因。

您需要更改代码，因为您不需要它们会删除事件.ajaxComplete。

这是你的代码：

function loadData(){
    $.ajax
    ({
        type: "POST",
        url: "includes/ajax/test.php",
        data: "number=" + number,
        success: function(msg)
        {
            $("#TableContainer").ajaxComplete(function(event, request, settings) {
                $("#TableContainer").html(msg);
            });
        }
    });
}

应该是：

function loadData(){
    $.ajax
    ({
        type: "POST",
        url: "includes/ajax/test.php",
        data: "number=" + number,
        success: function(msg)
        {
                $("#TableContainer").html(msg);
        }
    });
}

您的其他2个ajax请求也是如此。成功的代码在收到结果时会被执行。

JQuery从Ajax更改复选框状态

1 个答案: