Question

我是Javascript的新手，并且想知道为什么以下代码无效。

var p = document.createElement("p");
p.onmouseover = (function() {
    this.style.cursor='pointer';
})();

基本上，当用户将鼠标悬停在动态创建段落元素上时，我只希望光标更改为指针。

谢谢。

Answer 1

您通过将()放在最后来调用该函数。试试这个：

var p = document.createElement("p");
p.innerHTML = 'Hello World';
p.onmouseover = function() {
    this.style.cursor = 'pointer';
};  
document.body.appendChild(p);

这是一个working demo。

Answer 2

两个原因;

1.您尚未将元素附加到document。

您需要执行以下操作才能注册事件处理程序：

document.documentElement.appendChild(p);

2.您只需要定义该功能。您正在定义它，然后立即使用(function { ... })()语法调用它。你应该定义它，例如

p.onmouseover = function () {
    this.style.cursor = "pointer";
}

Answer 3

首先你不需要关闭。

var p = document.createElement("p");
p.onmouseover = function() {
    this.style.cursor='pointer';
};

Answer 4

IMO更好的方法是使用CSS来擅长

<style>
p {cursor:pointer;}
</style>

Answer 5

您是否考虑过使用CSS样式而不是在代码中设置它？如果您需要稍后调整演示文稿，将页面的视觉方面与编程分开是很方便的...

<style type="text/css">
.myStyle {cursor:pointer;}
</style>

javascript将成为：

this.setAttribute("class", "myStyle");

关于Javascript onmouseover的问题

5 个答案: