jQuery是一個非常強大的JavaScript庫，以它的方便性和易用性而聞名。jQuery提供了強大的選擇器，可以讓你快速地找到所需的元素。除此之外，jQuery還有一個非常強大的特性——DOM 操作，可以讓你輕松地操作 HTML 元素。
在這篇文章中，我們將看到如何使用 jQuery 創建一個簡單的登錄頁面。
<html>
<head>
<title>登錄頁面</title>
<script src="jquery-1.8.0.min.js"></script>
</head>
<body>
<div id="login">
<form>
<input type="text" placeholder="用戶名" name="username">
<input type="password" placeholder="密碼" name="password">
<input type="submit" value="登錄">
</form>
</div>
<script>
$(document).ready(function(){
$('input[type="submit"]').click(function(){
var username = $('input[name="username"]').val();
var password = $('input[name="password"]').val();
if(username == ''){
alert("請輸入用戶名");
return false;
}
if(password == ''){
alert("請輸入密碼");
return false;
}
alert("登錄成功");
return true;
});
});
</script>
</body>
</html>在上面的代碼中，我們首先引入了jQuery庫。接著，在頁面中添加了一個包含登錄表單的div元素，并使用jQuery選擇器選擇了表單中的輸入元素。然后，我們使用jQuery操作這些元素的值，檢查用戶輸入是否為空。如果輸入框為空，則彈出警告框，并返回 false，防止表單提交。否則，如果用戶名和密碼都有輸入，則彈出登錄成功的提示框，并返回 true，表單將被提交。
總之，jQuery是一個非常強大的JavaScript庫，它可以使我們的工作更加便利。本文所介紹的登錄頁面只是jQuery的一小部分功能，你可以在官方文檔中了解到更多的特性。希望這篇文章對你有所幫助！
上一篇css 動態水位圖