元素：悬停（）{

Question

<div align="right" style="border:1 #FF0 solid; background-color:#999" onMouseOver="javascript: function(){this.style.backgroundColor = '#DDD';}" onMouseOut="javascript: function(){this.style.backgroundColor = '#999';}">
Register
</div>

当鼠标悬停事件触发时，会出现此错误：

未捕获的SyntaxError：意外令牌（

我该怎么办？我想在onMouseOver和onMouseOut

中定义一个函数

Answer 1

请勿使用function声明，只需执行：

onMouseOver = "this.style.backgroundColor = '#DDD';"

和

onMouseOut = "this.style.backgroundColor = '#999';"

顺便说一下，您应该考虑 unobstrusive javascript 。

Answer 2

为什么要在场景中使用某个功能？你可以使用..

onMouseOut =“javascript：this.style.backgroundColor ='＃999'”＆gt;

Answer 3

你应该看看jQuery并使用不引人注目的javascript。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>

这就是你所需要的，它将把jQuery库从谷歌中拉出来。

然后，您可以使用外部样式表来处理您想要执行的操作。

<div id="container"> Register </div>

您需要创建一个外部样式表，例如app.css：

#container {border:1 #FF0 solid; background-color:#999;text-align:left;}

然后你可以有一个外部脚本，如app.js

$('#container').mouseout(function() {
  $('#container').css('backgroundColor', '#DDD')
});

不要忘记将外部css和js链接到页面。外部样式表需要在jQuery脚本之后链接。

http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js
<script src="app.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="app.css">

当鼠标执行操作时，您可以编辑脚本以添加更多功能：

$('#container').mouseout($('#container').css('backgroundColor', '#DDD'))
$('#container').mouseover($('#container').css('backgroundColor', '#DDD'))
$('#container').mouseenter($('#container').css('backgroundColor', '#DDD'))
$('#container').mouseup($('#container').css('backgroundColor', '#DDD'))

这里有一大堆主题：http://api.jquery.com/category/events/mouse-events/

Answer 4

为什么不用css？

元素：悬停（）{

}

或者它是你需要的js函数而bg只是一个例子？...在这种情况下你可以用jQuery获得一个简单的结果 $（ “＃元素”）。鼠标指向（函数（）{ $（本）.addClass（ “bghover”）; }）;

$（ “＃元件”）。mouseoutfunction（）{ $（本）.removeClass（ “bghover”）; }）;

Answer 5

您可以定义外部javascript方法，该方法接受所需的参数，并将此方法用于多个元素：

<script language="javascript" type="text/javascript">
function OnMouseDownEventHandler(sender) {
    sender.style.backgroundColor = '#DDD';
}
</script>

<div onmousedown="OnMouseDownEventHandler(this);"></div>

如何在onMouseOver和onMouseOut中定义函数

5 个答案:

元素：悬停（）{