Select All For jquery, cancel all for jquery, and cancel all for jquery

Source: Internet
Author: User

Select All For jquery, cancel all for jquery, and cancel all for jquery

Recently, the project used the "select all" and "unselect all" operation.

I used to write my own JS files. now that you know how to write. so how can we use JQ to write more concisely. in this way, you can learn new things. if Baidu finds a good stuff. thanks to OSCIuhoay.

The Code is as follows:

[Javascript]View plaincopy
  1. <Script type = "text/javascript" src = "/Webpage/bzz_index/password/js/jquery-1.7.1.min.js"> </script>
  2. <Script language = "JavaScript">
  3. $ (Function (){
  4. $ ("# CkAll"). click (function (){
  5. $ ("Input [name = 'sub']"). prop ("checked", this. checked );
  6. });
  7. $ ("Input [name = 'sub']"). click (function (){
  8. Var $ subs = $ ("input [name = 'sub']");
  9. $ ("# CkAll"). prop ("checked", $ subs. length = $ subs. filter (": checked"). length? True: false );
  10. });
  11. });
  12. </Script>

[Html]View plaincopy
  1. <Input type = "checkbox" id = "ckAll"/> check all <br/>
  2. <Input type = "checkbox" name = "sub"/> 1 <br/>
  3. <Input type = "checkbox" name = "sub"/> 2 <br/>
  4. <Input type = "checkbox" name = "sub"/> 3 <br/>
  5. <Input type = "checkbox" name = "sub"/> 4 <br/>


It must be said that JQ1.6 + is supported for prop. You can refer to the following section about prop.

I found a problem using JQuery today. attr ("checked") can obtain the checked attribute of the checkbox when it is selected. The value is "checked", but the undefined value is undefined.

To solve this problem, I have referred to this post:

Http://bugs.jquery.com/ticket/9812

Why is jquery 1.6 + added. the prop () method, because in some browsers, for example, you only need to write disabled and checked, and some need to write disabled = "disabled", checked = "checked ". Therefore, starting from 1.6, jq provides a new method "prop" to obtain these attributes. Previously, "checked" and "" were returned when the checked attribute was obtained using attr. Now, if the property is obtained using the prop method, both true and false are returned. So when to use attr and prop ?? 1. Add an attribute name. This attribute will take effect. If prop.2. is true or false, use prop.3. if other attributes are used, pay attention to this when using jquery upgrade in the attr project! We recommend that you use attr () and prop () as follows:

Note the following three points (From dark threads):

JQuery Team provides a reference table for attr ()/prop () For DOM element attributes:

Attribute/Property .attr() .prop()
Accesskey Bytes  
Align Bytes  
Async Bytes Bytes
Autofocus Bytes Bytes
Checked Bytes Bytes
Class Bytes  
Contenteditable Bytes  
DefaultValue   Bytes
Draggable Bytes  
Href Bytes  
Id Bytes  
Label Bytes  
Location * Bytes Bytes
Multiple Bytes Bytes
NodeName   Bytes
NodeType   Bytes
ReadOnly Bytes Bytes
Rel Bytes  
Selected Bytes Bytes
SelectedIndex   Bytes
Src Bytes  
Style Bytes  
Tabindex Bytes  
TagName   Bytes
Title Bytes  
Type Bytes  
Width ** Bytes

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.