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.com/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.com/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.com/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 次瀏覽

開啟您的 職業生涯

完成課程即可獲得認證

立即開始!
廣告