Sự kiện change() trong jQuery

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

- Sự kiện change() xảy ra khi giá trị của các phần tử như <select> <textarea> <input> bị thay đổi.

- Lưu ý:

Đối với phần tử <select>, sự kiện change() xảy ra khi người dùng chọn option khác.
Đối với các phần tử nhập liệu như <textarea> hoặc <input type="text"> thì sự kiện change() xảy ra khi người dùng nhập một nội dung mới rồi sau đó click chuột ra khỏi phần tử.
Đối với <input type="radio"> thì sự kiện change() xảy ra khi người dùng check vào một sự lựa chọn khác.
Đối với <input type="checkbox"> thì sự kiện change() xảy ra khi người dùng check hoặc bỏ check sự lựa chọn.
. . . .

- Ví dụ: Bạn hãy thử thao thác với các phần tử bên dưới để xem sự kiện xảy ra như thế nào.

Nhập họ tên của bạn rồi sau đó click chuột ra bên ngoài ....

Nam Nữ

Đã có người yêu =]]

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

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

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

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

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

$(selector).change();<

3) Một số ví dụ

Ví dụ:

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

<script>
    $(document).ready(function(){
        $("input[name='gender']").change(function(){
            alert("Sự kiện change() vừa mới xảy ra");
        });
    });
</script>

Xem ví dụ

Ví dụ:

- Khi phần tử <button> xảy ra sự kiện click() thì phần tử <textarea> sẽ được kích hoạt sự kiện change()

<script>
    $(document).ready(function(){
        $("button").click(function(){
            $("textarea").change();
        });
    });
</script>

Xem ví dụ