我是Java语言的新手，我想知道下面的行为。
考虑下面的工作代码：
<div><br/><strong>Click Me!</strong></div>
<script>
$(document).ready(function(){
$('div').mouseenter(function(){
$(this).fadeTo('fast',1);
});
$('div').mouseleave(function(){
$(this).fadeTo('fast',0.5);
});
});
</script>
但这不起作用：
<div onmouseover="fade()"><br/><strong>Click Me!</strong></div>
<script>
$(document).ready(function(){
$('div').mouseleave(function(){
$(this).fadeTo('fast',0.5);
});
});
function fade(){
$(this).fadeTo('fast',1);
}
</script>
当我全部使用内联事件处理程序和函数时，为什么第二个不起作用？
提前致谢！
首先，我不会这样做。从使用现代事件处理切换为onXyz属性有点落后。请参阅下面的折叠。
但是要回答为什么它不起作用的问题：this在fade第二个示例中，对的调用中没有div（它是全局对象，又名window在浏览器中）。您必须将其更改onmouseover为：
onmouseover="fade.call(this)"
...this在通话期间成为div。
（另外，请注意，您onmouseover在第二个代码块中使用了，但mouseenter在第一个代码块中使用了。我将其保留为onmouseover，但您可能想要onmouseneter使用它。）
例子：
$(document).ready(function(){
$('div').mouseleave(function(){
$(this).fadeTo('fast',0.5);
});
});
function fade(){
$(this).fadeTo('fast',1);
}<div onmouseover="fade.call(this)"><br/><strong>Click Me!</strong></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>或者，只需将其this作为参数传递并更改fade为使用它：
$(document).ready(function(){
$('div').mouseleave(function(){
$(this).fadeTo('fast',0.5);
});
});
function fade(element){
$(element).fadeTo('fast',1);
}<div onmouseover="fade(this)"><br/><strong>Click Me!</strong></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>但是同样，我不会使用onXyz属性。如果您不希望在ready回调中使用处理程序，则不需要这样做，但这并不意味着您必须切换到使用属性进行事件连接。反而：
$('div').mouseleave(function(){
$(this).fadeTo('fast',0.5);
});
$('div').mouseenter(function(){
$(this).fadeTo('fast',1);
});
例子：
$('div').mouseleave(function(){
$(this).fadeTo('fast',0.5);
});
$('div').mouseenter(function(){
$(this).fadeTo('fast',1);
});<div><br/><strong>Click Me!</strong></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句