Previous Lesson Next Lesson

.blur() trong jQuery

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

.blur(): Kèm một hành động khi sử dụng blur, sự kiện blur là khi người dùng thoát khỏi focus trong trường nhập (input).

Cấu trúc

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

.blur();
-------------------------------------------------------------------------------------
$('div.test').click(function(){
    $('input').blur();
});

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

.blur(function(){});
-------------------------------------------------------------------------------------
$('input').blur(function(){
    alert('Đã rời focus');
});

.blur();

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(){
    $('.clickFocus').click(function(){
        $('#txtField').focus().css('background','#ccc');
    });

    $('.clickBlur').click(function(){
        $('#txtField').blur().css('background','none');
    });
});
</script>
</head>

<body>
<button class="clickFocus">Focus</button><button class="clickBlur">blur</button><br />
<input type="text" id="txtField" value="Field" />
</body>
</html>

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

Ta thấy khi click button Focus, lập tức trường nhập (input) đã được focus, có thể gõ text, nhưng khi click button Blur thì trường nhập sẽ thoát.

.blur(function(){});

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(){
    $('#txtField').blur(function(){
        $('span').text('Đã rời focus');
    });
});
</script>
</head>

<body>
<input type="text" id="txtField" value="Field" /> <span></span>
</body>
</html>

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

Click vào trường nhập input (focus) và sau đó rời khỏi nó (click chỗ khác) sẽ thấy kết quả.

Previous Lesson Next Lesson

Preview

Viết câu trả lời

0 Bình luận

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

@ ·