Question

我几天来一直在努力解决这个问题，并且无法弄清楚为什么这样做不会奏效。我需要使用新文件更新页面上的链接。帖子请求和新文件显示在Google Chrome开发网络中，但实际页面不会更新。我查了other posts并且无法解决这个问题。我的理解是我的代码应该更新div＆＃34; mapData＆＃34;使用新的链接，图像等。开发窗口中的页面响应具有正确的html页面，我需要从中获取div部分，在显示的html页面中更改它，并更新该页面。应该很简单！

function updatePieFact(){
        var scenario = $("#scenario").val();
        var year_run = $("#year_run").val();
        var actType = $("input:radio[name=actType]:checked").val();
        var znType = $("input:radio[name=znType]:checked").val();
        var data = {'pieFact': pieFact, 'csrfmiddlewaretoken':'f89lua2QMAt7oz6057PVcahr3EUsSTyI', 'scenario':scenario, 'year_run':year_run, 'actType':actType, 'znType':znType};
        $.post(URL, data, function(data){
            var result = $('<div />').append(data).find('#mapData').html();
            $("#mapData").html(result);
        });
    }
    var pieFact = 1;
    $(document).ready(function(){
        $('#bttnMinus').click(function(){
            pieFact*=0.75;
            updatePieFact();
        });
        $('#bttnPlus').click(function(){
            pieFact*=1.25;
            updatePieFact();
        });
    });

Answer 1

你的意思是这样做吗？

$.post(URL, data, function(result){
    var mapDataHtml = $(result).find("#mapData").html();
    $("#mapData").html(mapDataHtml);
});

如果您的按钮位于mapData元素内，则在重新加载html时将删除它们的绑定。您希望使用jQuery.on而不是点击。

$(document).on('click', '#bttnMinus', function(){
    pieFact*=0.75;
    updatePieFact();
});

Answer 2

您可以使用http://api.jquery.com/load/进行略微简化。您的问题可能在于如何设置html。

$('#mapData').load(URL, data);

用jQuery更新div ajax响应html不发布返回页面

2 个答案: