Cách Dùng :focus Selector Trong JQuery - Freetuts

Trang chủ » Trong Jquery Sự Kiện Focus Có ý Nghĩa Gì » Cách Dùng :focus Selector Trong JQuery - Freetuts

Có thể bạn quan tâm

Focus Selector sẽ chọn phần tử đang được focus.

test php

banquyen pngBài viết này được đăng tại freetuts.net, không được copy dưới mọi hình thức.

Cũng giống như những selector giả định khác(những selector bắt đầu bằng ":") bạn nên đặt trước nó một tên thẻ hoặc một selector khác, nếu không nó sẽ được hiểu là bộ chọn toàn bộ("*"), nói các khác $( ":focus" ) tương đương với $( "*:focus" ), do đó nếu bạn muốn tìm phần tử hiện đang được focus, $( document.activeElement ) sẽ trả về phần tử đó mà không phải tìm kiếm toàn bộ các phần tử DOM.

Cú pháp

Cú pháp jQuery( ":focus" )

Ví dụ

Tìm kiếm thẻ đang được focus và đổi màu nền cho chúng:

Code RUN <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Học lập trình miễn phí tại freetuts.net</title> <script src="https://freetuts.net/cnd/js/jquery/jquery-3.2.1.min.js"></script> <style> .focused { background: #abcdef; } </style> </head> <body> <h1>Học lập trình miễn phí tại freetuts.net</h1> <div id="content"> <input tabIndex="1"> <input tabIndex="2"> <select tabIndex="3"> <option>select menu</option> </select> <div tabIndex="4"> a div </div> </div> <button onclick="myFunction()">Click vào đây sau đó focus vào các thẻ để xem kết quả</button> <script> function myFunction(){ $( "#content" ).delegate( "*", "focus blur", function() { var elem = $( this ); setTimeout(function() { elem.toggleClass( "focused", elem.is( ":focus" ) ); }, 0 ); }); } </script> </body> </html>

Kết quả:

Bài viết này được đăng tại [free tuts .net]

Tham khảo: jquery.com

Từ khóa » Trong Jquery Sự Kiện Focus Có ý Nghĩa Gì