06/04/2021, 14:49

Hàm :radio Selector trong jQuery - JQuery API

Radio Selector sẽ lựa chọn tất cả các phần tử có type là radio . $( ":radio" ) và $( "[type=radio]" ) tương đương với nhau, cũng giống như các selector giả định khác(các selector bắt đầu bởi dấu ":") chúng nên được đặt trước bởi một tên thẻ hoặc một selector nào đó nếu không nó sẽ ...

Radio Selector sẽ lựa chọn tất cả các phần tử có typeradio.

$( ":radio" ) và $( "[type=radio]" ) tương đương với nhau, cũng giống như các selector giả định khác(các selector bắt đầu bởi dấu ":") chúng nên được đặt trước bởi một tên thẻ hoặc một selector nào đó nếu không nó sẽ được hiểu là bộ chọn toàn bộ("*"). Nói cách khác $( ":radio" ) sẽ tương đương với $( "*:radio" ), do đó nên sử dụng $( "input:radio" ) để thay thế.

Để chọn tất cả các radio được liên kết với nhau(những tùy chọn radio cùng biểu thị cho một nội dung nào đó) bạn nên sử dụng $( "input[name=gender]:radio" ).

Chú ý: Bởi vì :radio 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 :radio 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, sử dụng [type="radio"] để thay thế.

Cú pháp

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

Ví dụ

Tìm kiếm phần tử input type="radio" và đổi màu cho phần tử bao quanh nó:

Code RUN
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Học lập trình miễn phí tại Zaidap.com.net</title>
        <script src="https://Zaidap.com.net/cnd/js/jquery/jquery-3.2.1.min.js"></script>
        <style>
            textarea {
                height: 45px;
            }
        </style>
    </head>
    <body>
        <h1>Học lập trình miễn phí tại Zaidap.com.net</h1>

        <form>
            <div>
                password:<input type="password">
            </div>
            <hr>
            <div>
                radio1:<input type="radio" name="radio">
            </div>
            <div>
                checkbox:<input type="checkbox">
            </div>
            <div>
                radio3:<input type="radio" name="radio">
            </div>
            <hr>
            <div>
                reset:<input type="reset">
            </div>
            <hr>
            <div>
            submit:<input type="submit">
            </div>
            <hr>
            <div>
                text:<input type="text">
            </div>
            <hr>
            <div>
                select:
                <select>
                    <option>Option</option>
                </select>
            </div>
            <hr>
            <div>
                textarea:<textarea></textarea>
            </div>
            <hr>
            <div>
                Button:<button>Button</button>
            </div>
        </form>
        <hr>
        <button onclick="myFunction()">Click vào đây để xem kết quả</button>
        <script>
            function myFunction(){
                $( "input:radio" ).parent().css( "background", "red");
            }
        </script>
    </body>
</html>

Kết quả:

 

Tham khảo: jquery.com

Nguồn: Zaidap.com.net

Trịnh Tiến Mạnh

27 chủ đề

6824 bài viết

Cùng chủ đề
0