通过将鼠标移到元素上来更改元素的标题

Question

我想编写一个函数titlep(a)，当鼠标放在数字上时，它们的标题等于 A该数字中的乘积。（数字A总是在变化，标题也随着变化而变化）我希望当鼠标位于数字+1、+2、+3、+4上时，这些数字的标题等于它们的乘积乘以数字A。朋友们可以帮我看看 Function 的问题出在哪里吗titlep(a)？var number ;setInterval(function(){     number = Math.floor((Math.random()*100)+1);  document.getElementById("in02").innerHTML = number   }, 5000); function titlep(a){        price =  number * a    this.setAttribute('title', price );    }<div style="cursor: pointer"><span  class="tp-cu-po" onmouseover="titlep(4)" title="333">4+  </span><br><span  class="tp-cu-po" onmouseover="titlep(3)">3+  </span><br><span  class="tp-cu-po" onmouseover="titlep(2)">2+  </span><br><span  class="tp-cu-po" onmouseover="titlep(1)">1+  </span><br>   </div><br>A = <a id="in02"></a>

Answer 1

似乎您没有使用 声明任何变量var，const或者let这可能是您遇到问题的地方。

通过this作为参数传递，您可以访问span您正在悬停的确切位置。在这个解决方案中，您可以更改其中任何一个的文本span，甚至添加更多内容，这仍然有效。

setInterval(function() {

  const number = Math.floor((Math.random() * 100) + 1);

  document.getElementById("in02").innerHTML = number

}, 5000);

function titlep(elem) {

  const aVal = document.getElementById('in02').textContent;

  const elemVal = elem.textContent.replace(/[^0-9]/g, '');

  elem.title = Number(aVal) * Number(elemVal);

}

<div style="cursor: pointer">

  <span class="tp-cu-po" onmouseover="titlep(this)">4+  </span><br>

  <span class="tp-cu-po" onmouseover="titlep(this)">3+  </span><br>

  <span class="tp-cu-po" onmouseover="titlep(this)">2+  </span><br>

  <span class="tp-cu-po" onmouseover="titlep(this)">1+  </span><br>

</div><br> A =

<a id="in02"></a>