Question

这个想法是：我有一个主要的DIV，内容迷你div汽车信息每行分为两个，我从DB获取查询，我想按下该按钮以重新加载该主要内容的新来自DB的内容，是可以做到的吗？请指教。

代码如下所示：

<div class="SearchBlocks">
    <div class="row">
        <div class="car_section">INFO</div>
        <div class="car_section">INFO</div>
        <div class="car_section">INFO</div>
        <div class="car_section">INFO</div>
        ......

    </div>
    <h2 class="load_more"><a id="more_link" href="#">Load more <i class="icon-custom_arrow"></i></a></h2>
</div>

Answer 1

    function reload(url){
       $.get(url, function(data){      // $.get will get the content of the page defined in url and will return it in **data** variable 
            $('#row').append(data);
       }
    }

$('#more_link').click(function(e){ 
        e.preventDefault();
        var url = 'http://example.com/somepage.html';
        reload(url);  // this calls the reload function
});

Answer 2

您没有显示用于生成AJAX请求的确切代码，但是一般模式将是这样的，其中更新逻辑被提取到它自己的函数中，该函数在加载时被调用。页面，然后单击#reload_cars按钮。

function getData() {
    $.ajax({
        url: 'yoururl.foo',
        success: function(data) {
            $('#row .car_section').remove();
            $('#row').append(data);
        }
    });
}
$('#reload_cars').on('click', getData);
getData();

Answer 3

只是使用

    function refreshDiv(){
       var container = document.getElementById("divId");
       var content = container.innerHTML;
       container.innerHTML= content;
    }

Ajax在点击按钮上重新加载div内容

3 个答案: