Question

我的网页上有一个图表，每当我点击图表中的某个点时，我都希望使用新内容更新div。通过我的功能，我设法更新它，但是当我点击一个新点时，新内容被添加到旧内容，依此类推，因为我想在我的div中只有当前内容。

这是我的功能：

$(document).ready(function() {
    $(div_to_update).text(content);
});

}

我试图实施

$("#chart_div").click(function()
   $('#div_to_update').remove();
});

但很明显它会删除我的div而我当时无法恢复它。

Answer 1

我认为，如果您想在点击某些内容时更改div中的数据，你可以这样做：

<script>
$(document).ready(function() {
   $(".point").click(function() {
      var content = $(this).attr('value');
      $("#div-to-update").html(content);
   });
});
</script>

页面正文中的

...

<div id='graph'>
   <div class='point' value='10'>
   <div class='point' value='100'>
   <div class='point' value='1000'>
</div>

<div id='div-to-update'>
    // when point is clicked, content here will change
</div>

Answer 2

如果要从DOM中删除匹配元素集的所有子节点，请使用empty()

$("#chart_div").click(function(){
    $("#div_to_update").empty();
});

Answer 3

如果你想删除你的div内部使用这个功能

$("#div_to_update").empty();

.text（内容）仅将内容设置为文本，而不是html。如果您想将其设置为html，请使用 .html（）这样的功能

$("#div_to_update").html(content);

Jquery - 如何使用新内容更新div

3 个答案: