Bài 1: Viết hàm trong jQuery

Đăng bởi Neo trong mục Hướng dẫn vào 04 tháng 11, 2009 | Comments

Như mootools, jQuery là một thư viện (framework) javascript giúp bạn viết code javascript nhanh hơn.

Tải về và thêm vào website

Để bắt đầu học jQuery, bạn cần tải về thư viện jQuery và thêm vào trang web của bạn:

<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

Viết hàm đầu tiên

Viết hàm trong jQuery khá đơn giản. Giả sử chúng ta có 1 trang html đơn giản với cấu trúc như sau:

<a id="hidebox" href="#">Click để ẩn</a>
<div id="box"></div>

Dùng CSS để style cho thẻ div có id="box"

#box {width: 500px; height: 300px; background: #FF0000}

Và ta sẽ dùng jQuery để ẩn box khi click vào thẻ <a>

$(function() {
	$('a#hidebox').click(function() {  //Thêm thuộc tính click vào thẻ  <a>
		$('#box').fadeOut(); // Ẩn element có id là box
	});
});

Với hàm trên, khi bạn click vào thẻ a có id là hidebox thì box sẽ từ từ mất đi. Tôi sẽ giới thiệu với các bạn các hiệu ứng cơ bản này trong bài tới.

Bạn có thích bài viết này?

Neo's picture

Neo

Nhìn mặt trời từ năm 1984 nhưng tới tận 2002 mới được thấy cái máy tính đầu tiên của mình. Đầu năm 2007 thì quyết định theo cái nghề cao quý là thiết kế web Big Grin. Hiện mình đang sống tại Hà Nội. Sở thích: làm website và giúp đỡ mọi người phát triển website theo chiều hướng tốt đẹp hơn.

Trang chủ - Twitter