Web Cơ Bản

Sự kiện dblclick() trong jQuery

1) Sự kiện dblclick() trong jQuery

- Sự kiện dblclick() xảy ra khi người dùng "click kép chuột trái" vào một phần tử.

- Ví dụ: Bạn hãy thử click kép chuột trái vào tấm hình bên dưới.

- Lưu ý: Khi sự kiện dblclick() xảy ra thì đồng nghĩa với việc sự kiện click() cũng xảy ra, nếu cùng một phần tử mà được thiết lập hai sự kiện dblclick() và click() thì sẽ có thể xảy ra những điều không mong muốn. Vì vậy bạn cần phải xác định kỹ việc phần tử nên được thiết lập sự kiện dblclick() hay click().

2) Cách sử dụng sự kiện dblclick() trong jQuery

- Có hai trường hợp sử dụng sự kiện dblclick():

- Trường hợp 1: Khi sự kiện dblclick() xảy ra thì một chức năng sẽ được thực thi:

$(selector).dblclick(function(){
    //đoạn mã sẽ được thực thi khi sự kiện dblclick() xảy ra
})

- Trường hợp 2: Kích hoạt sự kiện dblclick() cho một phần tử:

$(selector).dblclick();

3) Một số ví dụ

Ví dụ:

- Khi phần tử <button> xảy ra sự kiện dblclick() thì hiển thị một thông báo với nội dung là Sự kiện dblclick() vừa mới xảy ra


<script>
    $(document).ready(function(){
        $("button").dblclick(function(){
            alert("Sự kiện dblclick() vừa mới xảy ra");
        });
    });
</script>
Xem ví dụ
Ví dụ:

- Khi phần tử có id là button1 xảy ra sự kiện click() thì phần tử có id là button2 sẽ được kích hoạt sự kiện dblclick()


<script>
    $(document).ready(function(){
        $("#button1").click(function(){
            $("#button2").dblclick();
        });
    });
</script>
Xem ví dụ