Javascript 删除单击功能，但保持悬停不变

由于我的上一个问题被标记为重复的，而它不是重复的，并且没有人将其更改回，所以我将再次问我的问题。

我有一个

，但是
指针事件：无也阻止了悬停。

如果它仍然是一个副本，请将其标记为一个真正重复的问题的副本


编辑：
我忘了提到，我的悬停是这样做的：

HTML:

将
指针事件：none
添加到
a
元素，然后将鼠标悬停应用到父元素，特别针对
a
元素：


span a{
指针事件：无；
}
span：将鼠标悬停在a上{
颜色：红色；
}
我一开始不会使用锚点。用段落标记替换锚点并修改CSS

CSS:

HTML:


可悬停对象

文本对象，这里有很多解释网站某些功能的文本。
好的，这是可行的，但我的悬停功能有点不同。让我把它添加到我的问题中@MaartenWolfsen不将
指针事件：none
应用于
#item1
元素，而是直接应用于
a
元素
.container ul#item1 a{pointer events:none；}
老实说，在我的例子中，a标记不在li中：p@MaartenWolfsen我不太清楚你在问什么。您的问题表明您希望禁用单击功能，但将鼠标悬停在
元素上。您给出的标记显示了
元素中的
元素。你到底想发生什么？@MaartenWolfsen你在这里的HTML无效
元素不允许是
元素的直接子元素。很抱歉，我投票结束了您之前的问题，因为我误解了您的提问。将来，与其问一个新问题，不如简单地编辑你的问题以澄清你的意图（并解释为什么你觉得它不是重复的）。那么你真的需要在那里使用锚元素吗？无论如何，James的答案仍然有效：所以你想要工具提示之类的东西，你可以把#item2 id的文本放在#item1的标记中，你可以把它显示在#item1id的悬停处。你为什么要创建多个
标记。这回答了你的问题吗？
<div class="container">
  <ul>
    <li id="item1"><a href="somelinkthatistherebecauseitis">hoverable object</a></li>
    <li id="item2">text object, here comes alot of text explaining certain features of the website.</li>
  </ul>
</div>

.container ul #item2 {
  display: none;
  width: 150px;
  padding: 20px;
  background: red;
  color: white;
  cursor: pointer
}

.container ul #item1 {
  pointer-events: none;
}

.container ul #item1:hover + #item2 {
  display: block;
}

.container #item2 {
    display: none;
    width: 150px;
    padding: 20px;
    background: red;
    color: white;
}

<div class="container">
    <p id="item1" href="somelinkthatistherebecauseitis">hoverable object</p>
    <div id="item2">text object, here comes alot of text explaining certain features of the website.</div>
</div>