14/08/2018, 09:47

:input Selector trong jquery

Input Selector sẽ lựa chọn tất cả các phần tử cơ bản của thẻ form như các thẻ button , input , select , textarea . Chú ý : Bởi vì :Input 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 :Input sẽ không thể phát huy hiệu quả của phương thức ...

Input Selector sẽ lựa chọn tất cả các phần tử cơ bản của thẻ form như các thẻ  button, input, select, textarea.

Chú ý: Bởi vì :Input 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 :Input 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, Trước tiên bạn nên sử dụng một selector được hỗ trợ bởi CSS, sau đó sử dụng .filter(":input") để lọc lại các kết quả.

Cú pháp

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

Ví dụ

Tìm kiếm tất cả các phần tử cơ bản của thẻ form và thêm border cho chúng:

Code RUN
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>all demo</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>
            Button: <input type="button">
            <br>
            file: <input type="file">
            <br>
            image: <input type="image">
            <br>
            password: <input type="password">
            <br>
            reset: <input type="reset">
            <br>
            submit: <input type="submit">
            <br>
            text: <input type="text">
            <br>
            select: 
            <select>
                <option>Option</option>
            </select>
            <br>
            textarea: <textarea></textarea>
            <br>
            Button: <button>Button</button>
        </form>
        <button onclick="myFunction()">Click vào đây để xem kết quả</button>
        <script>
            function myFunction(){
                $( ":input" ).css({
                    border: "2px solid red"
                });
            }
        </script>
    </body>
</html>

Qua ví dụ trên ta có thể thấy, Input selector đã chọn tất cả các phần tử cơ nhất thường xuất hiện trong thẻ form.

Kết quả:

Tham khảo: jquery.com

Các loại api khác

  • jQuery Selector
  • jQuery Events

Nguồn: code24h.com

0