logo标签列表

使用jQuery重新加载特定元素

javascriptjqueryajax
5

我正在尝试使用jQuery在按钮单击时重新加载特定元素，但是当我单击按钮时，整个页面都会加载到这个元素中。 我尝试了以下代码，它将整个页面加载到了这个元素中。 我希望只加载特定的元素。


我要用jQuery重新加载特定元素，而不是整个页面。
$(document).ready(function() {
    $("#button").click(function() {
        $("#demo").load(location.href + "#demo");
    });
});


<div id="example">
    <p id="demo">hi</p>
    <button id="button" type="button">press</button>
</div>
3个回答
18

您可以使用选择器与load()一起使用。

$("#demo").load(location.href + " #demo"); // Add space between URL and selector.
                                 ^

这将仅从 location.href URL 加载 #demo 元素。

3

您需要使用$.get()来加载页面并提取#demo片段：

$("#button").click(function() {
  $.get(location.href).then(function(page) {
    $("#demo").html($(page).find("#demo").html())
  })
})
2
你可以使用Ajax，然后用responseText创建元素，最后把它放入div中：
<head>
    <script>
        $(document).ready(function() {
            $("#button").click(function(){
                $.ajax({
                    url: location.href,
                    type:  'GET',
                    sucess: function(data)
                    {
                        refreshedPage = $(data);
                        newDemo = refreshedPage.find("#demo").html();
                        $('#demo').html(newDemo)
                    }
                });
            }
        }
    </script>
</head>

<body>
    <div id="example">
       <p id="demo">hi</p>
       <button id="button" type="button">press</button>
    </div>
</body>

但是，如果您加载整个页面，它可能会变得不太有用。我建议制作一个仅返回请求数据的php脚本，并在页面加载时和按钮点击时通过Ajax调用它...

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接