mouseenterr功能无响应

时间:2015-06-24 09:33:14

标签: jquery html

我的代码在JSFiddle https://jsfiddle.net/gcubc2kn/中有效,但我无法在记事本++中使用它。我不确定问题是什么,因为我一般都不熟悉HTML。

<!DOCTYPE html>
<html>

<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">      </script>

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>

<script>

$('button').mouseenter(function () {    

$(this).html($(this).html() + '_');

});

$('button').mouseleave(function () {

var currentText = $(this).html

 $(this).html('about');
});
</script>

<style>
</style>

</head>

<body>
    <button id="button">about</button> 
</body>

</html>

1 个答案:

答案 0 :(得分:1)

您尝试在按钮实际存在之前附加到按钮的mouseenter / mouseleave事件。

尝试将脚本移动到正文的底部。

或附加到事件when the document is ready

$(function() { // Shorthand for $( document ).ready()

    $('button').mouseenter(function () {    

    $(this).html($(this).html() + '_');

    });

    $('button').mouseleave(function () {

    var currentText = $(this).html

     $(this).html('about');
    });

});

或者像这样附上文件:

$(document).on('mouseenter', 'button').mouseenter(function () {    

    $(this).html($(this).html() + '_');

});

$(document).on('mouseleave', 'button', function () {    

    var currentText = $(this).html

     $(this).html('about');
});

这样,在附加到事件之前或之后创建元素无关紧要。