如何告诉Jquery在使用load函数时不要删除所有内容 - How to tell Jquery not to remove all content when using the load function?

How to tell Jquery not to remove all content when using the load function?

本文关键字：删除函数 Jquery 何告诉 load | 更新日期: 2023-09-27

我有一个jquery函数加载一个php文件，它将输出一些数据到一个div。代码:

function add(){
    $("#div").load("add.php");
}

现在的问题是，我需要能够多次使用该功能，而不会覆盖#div中的内容。所以现在每次我使用这个函数时，div中的文本都会被删除，并插入新的内容。

我该如何解决这个问题?

试试这个:

function add () {
    $( div ).append( $( '<div>' ).load( 'add.php' ) );
}

，其中div是对DIV元素的引用。(当然，您希望有一个引用，而不是在每次调用add()时查询DIV。)

更新:

因此，从服务器返回的数据是'<li>...</li>'字符串，这意味着您希望将其直接附加到UL元素:

$.get( 'addday.php', function ( data ) {
    $( ul ).append( data );
});

如果您计划使用该函数将内容添加到不同的</div>中，您可以将该函数传递给目标，而不是使用静态选择器，如:

// Add Function //
function add($target){
    $target.load('add.php');
}
// Call Function and Pass jQuery Object of Target //
add($('#firstDiv'));
add($('#someOtherDiv'));

如果你打算使用这个函数来添加到相同的div中，你可以这样修改上面的函数:

function add($target){    
    $target.append($('<span>').load('add.php'));
}

我希望这对你有帮助!

使用$.ajax()您可以获得响应并将其附加到您的div:

$.ajax({
    url:     'add.php',
    type:    'GET',
    success: function(response) {
                var html = $("#div").html();
                $("#div").html(html + response);
                // or jQuery(response).wrap('<p />').appendTo('#div');
    });

$.get("add.php", function (data) {
    $("#div").append(data);
});

您可以将.get()函数与特定的成功处理程序一起使用:

$.get('add.php', function(data) {
  $('#div').append(data);
});

尝试:

$.get('add.php', function(data) {
    $('#div').append(data);
});