14/08/2018, 09:40

:checkbox Selector trong jquery

checkbox Selector sẽ lựa chọn tất các phần tử input có type=checkbox. $( ":checkbox" ) tương đương với $( "[type=checkbox]" ). 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 ...

checkbox Selector sẽ lựa chọn tất các phần tử input có type=checkbox.

$( ":checkbox" ) tương đương với $( "[type=checkbox]" ). 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 $( ":checkbox" ) tương đương với $( "*:checkbox" ), do đó $( "input:checkbox" ) nên được sử dụng để thay thế $( ":checkbox" ).

Chú ý: Bởi vì :checkbox 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 :checkbox 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="checkbox"] để thay thế.

Cú pháp

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

Ví dụ

Tìm kiếm tất cả các thẻ input có type=checkbox và đổi màu cho chúng:

Code RUN
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>all demo</title>
        <style>
            textarea {
                height: 35px;
            }
            div {
                color: red;
            }
            fieldset {
                margin: 0;
                padding: 0;
                border-awidth: 0;
            }
            .marked {
                background-color: yellow;
                border: 3px red solid;
            }
        </style>
        <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>
        <fieldset>
            <input type="button" value="Input Button">
            <input type="checkbox">
             
            <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>
        </fieldset>
        <button onclick="myFunction()">Click vào đây để xem kết quả</button>
        <script>
            function myFunction(){
                var input = $( "input:checkbox" )
                .wrap( "<span></span>" )
                .parent()
                .css({
                    background: "yellow",
                    border: "3px red solid"
                });
            }
        </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