Click Jquery: Sự kiện khi nhấp chuột vào một phần tử html

Sự kiện Click trong jquery là một công cụ giúp chúng ta kích hoạt những hành động khi nhấp chuột vào một đối tượng html nào đó trên website.

Cú pháp

$(selector).click(function(){
    //Code xử lý khi click thành công
});

Trong đó: selector chính là bộ chọn đến phần tử cần click vào nó. Nó có thể là một phần tử html, class, id

Lưu ý: Trước khi sử dụng sự kiện click trong jquery bạn cần import thư viện ở trong thẻ <head>

<head>

<head>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>

Ví dụ 1: Hiển thị thông báo khi click vào thẻ a

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Sự kiện Click Jquery</title>
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
</head>
<body>
<script>
$(document).ready(function(){
    $('h2').click(function(){
        alert("Click h2 by Jquery");
    });
});
</script>

<h2>Click Jquery</h2>

</body>
</html>

Trong chương trình trên khi click vào h2 thì sẽ hiển thị lên một hộp thoại

Click h2 by Jquery

Tự động kích hoạt sự kiện click vào một đối tượng

Đây là một giải pháp giúp chúng ta muốn tự động kích hoạt sự kiện click vào một đối tượng thông qua một sự kiện khác.

Ví dụ 2: Kích hoạt click vào #target

$( "#other" ).click(function() {
  $( "#target" ).click();
});

Qua ví dụ trên bạn thấy khi click vào #other sẽ tự động kích hoạt sự kiện click vào thẻ #target

Tổng kết

Qua bài viết này bạn đã được tôi giới thiệu về sự kiện click trong Jquery, việc của bạn bây giờ cần cài đặt lại những ví dụ trên để nắm chắc bài học.

Đề xuất cho bạn

Subscribe
Notify of
guest

0 Comments
Newest
Oldest Most Voted
Inline Feedbacks
View all comments

Tặng Ebook chia sẻ kinh nghiệm học lập trình web đi làm cho người mới bắt đầu!

Đây là tấm bản đồ chia sẻ lại cách học lập trình web đi làm đã giúp nhiều học trò của unitop kiếm được thu nhập từ 8-30tr mỗi tháng.

Ebook Bí quyết học lập trình web đi làm - Phan Văn Cương - Unitop.vn
0
Bạn đang nghĩ gì? Hãy để lại bình luận tại đâyx
()
x