Question

所以我有一个来自数据库的帖子的“提要”，我希望有一个按钮只刷新包含帖子的div，而不是重新加载整个页面。

Answer 1

假设div是

<div id="myContent"></div>

并且您希望在变量ajaxCont中存储的新html标记中刷新其内容。

更改#myContent div

的内容

document.getElementById("myContent").innerHtml(ajaxCont);

如果要将内容添加到当前内容

document.getElementById("myContent").appendChild(ajaxCont);

Answer 2

Javascript本质上会修改页面上的内容，因此您无需刷新＆＃39;用于更新其内容的页面。

如果您正在使用AJAX从XML或JSON源动态提取数据，您可以在此处查看我的示例：http://penguin.uclan.ac.uk/~lnelson/TE2006/ex3.html

或者，只有谷歌AJAX和那里有丰富的资源。

Answer 3

在Jquery

 <button id="MyButton">Refresh</button>

$(document).ready(function () {
     $("#myButton").on("click", function () {
        $("#div").load("index.php")
     });
});

Answer 4

Ajax（异步JavaScript和XML的简称）是您正在寻找的。您可以添加一个按钮监听器来运行您的Ajax代码，该代码又可以调用您的数据库查询。

您的Ajax功能将类似于：

function loadData() {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
      if (xhttp.readyState == 4 && xhttp.status == 200) {
         document.getElementById("yourDivId").innerHTML = xhttp.responseText;
      }
    };
    xhttp.open("GET", "databaseQuery.php", true);
    xhttp.send();
}

您的按钮侦听器将调用Ajax函数：

<button onclick="loadData()">Click me</button>

如果您使用php查询数据库，只需echo来自databaseQuery.php的结果。

如何使用按钮刷新div

4 个答案: