Question

我知道这个问题可能很容易解决，但我无法找到合适的答案。我想根据下拉选择更改来更改div内容。内容来自服务器的Ajax响应：

$(document).ready(function(){
$('.iterationDropdown').change(function() {
    var pathname = window.location.pathname;
    $.ajax({
        url: pathname + "get_tasks/",
        type: "post",
        csrfmiddlewaretoken:'{{ csrf_token }}',
        data: $(".iterationDropdownForm").serialize(),
        success: function(responseData) {
            $.each(responseData, function(key, value){
                $(".tasks").html("<p><a href =" + pathname + "task/" + value[1] + ">Google</a></p>")
            })
        }
    })
});

}）;

当我使用.html()时，只有Json响应中的第一个值被插入到div中（我认为是因为循环）。当我使用.append()时，当我从下拉菜单中选择另一个选项时，div会附加额外的Json数据...

Answer 1

在迭代json之前成功删除div之前的html然后追加这样的新html：

success: function(responseData) {

    $(".tasks").html(""); // all html will be removed from the div

    $.each(responseData, function(key, value){

    $(".tasks").append("<p><a href =" + pathname + "task/" + value[1] + ">Google</a></p>")

    })
}

Jquery在下拉列表的更改（）中更改div内容

1 个答案: