JS“重新加载” div元素内容而无需刷新页面

Question

我有使用画布从chartJS中获得的购物车。

当我将鼠标悬停在网站的侧边栏上时，页面布局会发生变化，并且图表不再适合框，因为它的尺寸大于白框的尺寸。

这条线走出白框。

但是当我此时重新加载页面时，一切都非常完美。

我的问题：

当我将鼠标悬停在侧栏上时，是否有一种方法可以添加事件或其他内容，或者重新加载该图表元素的宽度，以便它可以自动适应框，而无需刷新页面？

Answer 1

有mouseover个事件，您可以使用其中之一：

let sidebar = document.querySelector(".sidebar");
  
// This handler will be executed only once when the cursor
// moves over the unordered list
sidebar.addEventListener("mouseenter", function( event ) {   
  // call chartJS here
});

let sidebar = document.querySelector(".sidebar");

// This handler will be executed every time the cursor
// is moved over a different list item
sidebar.addEventListener("mouseover", function( event ) {   
  // call chartJS here
});

有关事件的更多信息，请访问以下页面： https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events