:focus

Đăng bởi: Admin

Định nghĩa và sử dụng

Bộ chọn :focus: giúp chọn được thành phần khi được focus.

Cấu trúc

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

$(':focus')

$('input:focus')

Ví dụ

Html viết:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<style>
.bgFocus {
    background: blue;
}
</style>
<script>
$(function(){
    $("body").delegate("*","focus blur", function(event) {
        $(this).toggleClass("bgFocus", $(this).is(":focus"));
    });
$(function(){
</script>
</head>

<body>
<input type="button" value="Button input" /> type = button<br />
<input type="text" value=" type = text" /><br />
<input type="hidden" value="hidden" /> type = hidden<br />
<span style="display:none;">span display none</span> span display none<br />
<input type="file" /> type = file<br />
<input type="image" src="images/btn_submit.jpeg" /> type = image<br />
<input type="password" value="password" /> type = password<br />
<input type="radio" /> type = radio<br />
<input type="radio" checked="checked" /> checked<br />
<input type="radio" disabled="disabled" /> disabled<br />
<input type="text" value="type = text" /><br />
<input type="reset" value="Reset" /> type = reset<br />
<input type="submit" value="Submit" /> type = submit<br />
<input type="checkbox" /> type = checkbox<br />
<select>
<option>option01</option>
<option>option02</option>
<option>option03</option>
</select><br />
<textarea rows="5" cols="25">textarea</textarea><br />
<input type="checkbox" checked="checked" /> checked<br />
<input type="checkbox" selected="selected" /> selected<br />
<input type="checkbox" disabled="disabled" /> disabled<br />
<button>Button</button> tag button.
</body>
</html>

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

$(':focus') giúp chọn được thành phần khi được focus, click vào các trường input để thấy hiệu ứng.

Theo dõi VnCoder trên Facebook, để cập nhật những bài viết, tin tức và khoá học mới nhất!