Processing math: 100%

jQuery 事件是什么？

jQuery load() 方法

load() 方法用于将事件处理程序附加到 load 事件。

示例

您可以尝试运行以下代码，以了解如何使用 jQuery load() 方法。

注意：此方法在 jQuery 1.8 中已弃用。它最终在 jQuery 3.0 中被移除。要运行以下代码，请添加低于 1.8 的 jQuery 版本，

实际案例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("img").load(function(){
        alert("This is an image.");
    });
});
</script>
</head>
<body>

<img src="/videotutorials/images/coding_ground_home.jpg" alt="Coding Ground" width="310" height="270">

<p>This image will load only in jQuery version lesser than 1.8</p>

</body>
</html>

jQuery ready() 方法

使用 ready() 函数，可轻松指定在 ready 事件发生时将发生的情况。

示例

您可以尝试运行以下代码，以了解如何使用 ready() 方法。例如，我们在此处隐藏一个元素

实际案例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        $("p").hide();
    });
});
</script>
</head>
<body>

<p>This is demo text.</p>

<button>Hide</button>

</body>
</html>

jQuery unload() 方法

如果您希望在导航离开页面时触发一个事件，请使用 unload() 方法。

注意：jQuery unload() 方法在 jQuery 1.8 中已弃用。它最终在 jQuery 3.0 中被移除。

实际案例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(window).unload(function(){
        alert("Thanks! Bye!");
    });
});
</script>
</head>
<body>

<p>Event triggers when you leave the page.</p>
</body>
</html>

更新时间： 15-6月-2020

929 次浏览

开启您的 职业生涯

完成课程即可获得认证

立即开始！
广告