.off() trong jQuery

Định nghĩa và sử dụng .off() trong jQuery

.off(): Thường được sử dụng để loại bỏ việc xử lý một sự kiện của thành phần khi sử dụng phướng thức .on()

Cấu trúc .off() trong jQuery

Đã được thêm vào từ phiên bản 1.7

.off()

$('p').off();

.off('sự kiện','bộ chọn','Xử lý sự kiện')

$('p').off('click','.test',function(){...});

.off()

Html viết:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
    $("p").on("click",function(){
        $(this).css("background-color","yellow");
    });
    $("button").click(function(){
        $("p").off();
    });
});
</script>
</head>

<body>
<p>Thành phần p</p>
<p>Thành phần p</p>
<p>Thành phần p</p>
<button>Click</button>
</body>
</html>

Hiển thị trình duyệt:

Click vào từng thành phần p sẽ thấy hiệu ứng thay đổi background, tuy nhiên nếu ta click vào button trước thì việc thực hiện sự kiện của thành phần p sẽ không còn.

.off('sự kiện','bộ chọn','Xử lý sự kiện')

Html viết:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(function(){
    var x=0;
    $("p").click(function(event){
        $(this).animate({fontSize:"+=3px"});
        x++;
        if (x>=3){
            $(this).off(event);
        }
    }); 
});
</script>
</head>

<body>
<p>Click để zoom text, có thể click để zoom được 3 lần</p>
</body>
</html>

Hiển thị trình duyệt:

Sự kiện click để zoom text được loại bỏ khi x>=3.

Previous Lesson Next Lesson

Preview

Viết câu trả lời

0 Bình luận

bắt đầu chủ đề từ ·

@ ·