在jquery中使用鼠标悬停

kx7yvsdv  于 2022-11-03  发布在  jQuery
关注(0)|答案(3)|浏览(210)

我想写一个jquery,通过鼠标悬停更改第一个<ul>的包含,第一个<ul>默认包含111,当鼠标悬停在aaa上时,显示111bbb显示222ccc显示333
第一个

w51jfk4q

w51jfk4q1#

您说使用jQuery,所以不需要循环和addEventListener,您所需要的只是使用data属性指定链接内显示的数据(如下面代码片段中的data-text)
使用hover监听器,然后使用**$(this)**关键字访问当前悬停的数据,然后显示数据,仅此而已
请参阅以下片段:
第一个

yi0zb3m4

yi0zb3m42#

为了让代码更容易阅读,你应该使用querySelectorAll来选择链接,然后使用forEach遍历元素,为每个元素添加一个eventListener
在下面的示例中,我创建了一个名为 handleMouseOver 的函数。该函数需要一个id作为参数,它是列表项的id。
然后,该函数触发switch语句以确定哪个文本属于此ID。然后,此文本将应用于您的 span_Lan 元素。
我还在初始化脚本时调用了一次该函数,以填充默认值(即111)。
第一个

x8diyxa7

x8diyxa73#

您的代码有一些问题

  • 您需要使用innerTextinnerHtml,而不是value
  • 接下来,您需要将事件传递到鼠标上方,并使用当前目标而不是boxLi[i]
  • 最后,移动你的id到li,因为那是什么鼠标在上

而且这也不是jQuery
第一个

相关问题