14/08/2018, 09:49

:file Selector trong jquery

File Selector sẽ lựa chọn phần tử html có type=file. :file và [type="file"] tương đương với nhau về chức năng. 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 ...

File Selector sẽ lựa chọn phần tử html có type=file.

:file và [type="file"] tương đương với nhau về chức năng.

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 $( ":file" ) tương đương với $( "*:file" ), do đó $( "input:file" ) hoặc các thẻ tương tự nên được sử dụng để thay thế $( ":file" ).

Chú ý: Bởi vì :file là một Jquery extension và không phải là một phần thiết lập của CSS, các truy vấn sử dụng :file sẽ không thể phát huy hiệu quả của phương thức querySelectorAll(). Để đạt được hiệu quả cao nhất khi sử dụng bạn nên sử dụng [type="file"] để thay thế.

Cú pháp

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

Ví dụ

Tìm kiếm thẻ các thẻ input có type=file và đổi màu nền cho nó:

Code RUN
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Học lập trình miễn phí tại code24h.com</title>
        <script src="https://code24h.com/cnd/js/jquery/jquery-3.2.1.min.js"></script>
    </head>
    <body>
        <h1>Học lập trình miễn phí tại code24h.com</h1>
    
        <form>
            <input type="button" value="Input Button">
            <input type="checkbox">
            <input type="file">
            <input type="hidden">
            <input type="image">
            <input type="password">
            <input type="radio">
            <input type="reset">
            <input type="submit">
            <input type="text">
            <select><option>Option</option></select>
            <textarea></textarea>
            <button>Button</button>
        </form>
        <button onclick="myFunction()">Click vào đây để xem kết quả</button>
        <script>
            function myFunction(){
                $( "input:file" ).css( "background", "red");
            }
        </script>
    </body>
</html>

Kết quả:

Tham khảo: jquery.com

Các loại api khác

  • jQuery Selector
  • jQuery Events

Nguồn: code24h.com

0