JS 在鼠标悬停时改变变量

Question

我尝试更改 onmouseover 变量，这是我的代码：

$(document).ready(function() {
    var x;
    $(".button").hover(function() {
        console.log (x);
    });        
});
</script>
<div class="button" onmouseover="x = 'y'"> Button </div>

Answer 1

你有两个x变量。

• 将'y'分配给它时隐式创建的全局x
• 传递给ready()的匿名函数范围内的x ，它是由var x;显式创建的var x; .

您正在为其中一个赋值并记录另一个的值。

---

不要使用内在事件属性。 只需通过 JavaScript 绑定您的事件处理程序。 然后你可以保持你的范围清晰，并确保你只处理一个x 。

 $(function() { var x; $("button").on('mouseover', setValue); $("button").on('mouseover', logValue); function setValue() { x = "y"; } function logValue() { console.log(x); } });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <button type="button">Button</button>

---

注意：HTML 有一个非常好的按钮元素。 您不需要使用类来表示它。