Home > Article > Web Front-end > Detailed example of jQuery form object attribute filter selector
This article mainly brings you an example of the jQuery selector's form object attribute filtering selector. The editor thinks it’s pretty good, so I’ll share it with you now and give it as a reference. Let’s follow the editor to take a look, I hope it can help everyone.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title></title> <link rel="stylesheet" href="imooc.css" rel="external nofollow" type="text/css"> <style> input { display: block; margin: 10px; padding: 10px; } </style> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <h2>子元素筛选选择器</h2> <h3>enabled、disabled</h3> <form> <input type="text" value="未设置disabled" /> <input type="text" value="设置disabled" disabled /> <input type="text" value="未设置disabled" /> </form> <script type="text/javascript"> //查找所有input所有可用的(未被禁用的元素)input元素。 $("input:enabled").css("border", "2px groove red"); </script> <script type="text/javascript"> //查找所有input所有不可用的(被禁用的元素)input元素。 $("input:disabled").css("border", "2px groove blue"); </script> <h3>checked、selected</h3> <form> <input type="checkbox" checked="checked"> <input type="checkbox"> <input type="radio" checked> <input type="radio"> <select name="garden" multiple="multiple"> <option>imooc</option> <option selected="selected">慕课网</option> <option>aaron</option> <option selected="selected">博客园</option> </select> </form> <script type="text/javascript"> //查找所有input所有勾选的元素(单选框,复选框) //移除input的checked属性 $("input:checked").removeAttr('checked') </script> <script type="text/javascript"> //查找所有option元素中,有selected属性被选中的选项 //移除option的selected属性 $("option:selected").removeAttr('selected') </script> </body> </html>
Note:
In some browsers, the selector:checked may be incorrect The 5a07473c87748fb1bf73f23d45547ab8 element is selected, so to be on the safe side, use the selector input:checked to ensure that only the d5fd7aea971a85678ba271703566ebfd element is selected.
Related recommendations:
Detailed explanation of jquery selector practice
Detailed explanation of jQuery form element selector
Example sharing JQuery selector and DOM node operation practice
The above is the detailed content of Detailed example of jQuery form object attribute filter selector. For more information, please follow other related articles on the PHP Chinese website!