如何实现鼠标悬停图例区域时不显示手型指针？附代码疑问

首先得说，你给出的这段代码window.setTimeout("document.body.style.cursor = 'hand';", 2000);完全没办法实现你的需求哦——它是延迟2秒后把整个页面的鼠标指针改成手型，反而和你要的“图例区域不显示手型”背道而驰了。下面给你两种靠谱的实现方式：

方法一：用CSS（最推荐，简单高效） #

直接给你的图例元素设置cursor属性为默认样式就行，这样鼠标悬停在图例上时，指针会保持系统默认的箭头样式，不会变成手型。

假设你的图例元素有个类名叫.legend，写这样的CSS代码：

.legend {
  cursor: default; /* 或者用 cursor: auto; 效果差不多 */
}

如果图例是通过ID选择的，比如#chart-legend，那把选择器换成#chart-legend就行。

方法二：用JavaScript（适合动态生成图例或需要动态控制的场景） #

如果你的图例是动态加载的，或者需要根据某些条件切换指针样式，可以用JS监听鼠标事件：

// 获取所有图例元素
const legendItems = document.querySelectorAll('.legend');

// 给每个图例元素添加鼠标进入和离开的监听
legendItems.forEach(item => {
  // 鼠标悬停时设置为默认指针
  item.addEventListener('mouseenter', () => {
    item.style.cursor = 'default';
  });
  
  // 鼠标离开时恢复原来的指针样式（如果需要的话）
  item.addEventListener('mouseleave', () => {
    item.style.cursor = '';
  });
});

这样就能精准控制图例区域的鼠标指针样式啦。

内容的提问来源于stack exchange，提问作者Aqqqq