jquery check box

Source: Internet
Author: User

$ ("#frmTest: CheckBox"). attr ("Checked", "true");

Frmtest the ID of the form from the above code allows all check boxes in the form to be fully selected

But

$ ("#frmTest: CheckBox"). attr ("Checked", "flase"); Failed to cancel Select all

The correct cancellation of the full select Code is

$ ("#frmTest: CheckBox"). Prop ("Checked", flase);

Note Flase cannot add double quotes

Similarly

$ ("#frmTest: CheckBox"). attr ("Checked", "true"); Select the Radio box and

$ ("#frmTest: CheckBox"). attr ("Checked", "flase"); Failed to uncheck

The correct code is

$ ("#frmTest: Radio"). Prop ("Disabled", flase);

It is recommended to use prop

---------someone else's blog-------

Recent projects have also used this all-in and deselect-all operation.

I used to write pure JS myself. Now that I know how to write it. How to write more succinctly with JQ. This will also learn something new. If Baidu did find a good thing. Thanks to the Iuhoayof the OSC.

The code is as follows:

[JavaScript]View PlainCopyprint?
  1. <script type="Text/javascript" src="/web/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 PlainCopyprint?
  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 />


Must say is jq1.6+ above only support prop Oh. About prop you can look at the following.

Today, when using jquery, I found a problem with. attr ("checked") to get the Checked property of the checkbox when selected, the value is "checked" but not checked to get the value is undefined.

To resolve this article I have referred to this post:

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

Why does the jquery 1.6+ increase the. Prop () method, because in some browsers, for example, just write disabled,checked, and some will be written disabled = "Disabled", checked= "checked". Therefore, from 1.6 onwards, JQ provides a new method of "prop" to obtain these properties. When we used attr to get the checked property, we returned "checked" and "", and now we get the property using the Prop method to return true and false uniformly. So, when to use attr, when to use prop?? 1. Add property name This property will take effect should use PROP.2. Yes, there are true,false two properties using PROP.3. Others use the attr project in the jquery upgrade when you need to pay attention to this! The following are the official recommendations for the use of attr (), prop ():

But there are three points to note (excerpt from the Dark thread):

  1. $ (window). attr (), $ (document). attr () is recommended instead of $ (Windows). Prop (), $ (document). Prop (), because window and document theoretically do not add HTML Attribute, although jquery 1.6.1 inside will secretly switch to. Prop (), after all, the semantics are illogical and should be avoided.
  2. In the HTML syntax <input type= "checkbox" checked= "Checked"/>, checked attribute will only set the Checked property to true at the outset, Subsequent state changes and storage are made through the checked property. In other words, checked attribute only affects the initial value, then the checked property shall prevail. For this reason, $ (": CheckBox"). Prop ("checked", true) will be more reasonable than $ (": CheckBox"). attr ("Checked", true). Although the jquery 1.6.1 has let $ (": CheckBox"). attr ("Checked", true) also has the ability to change the checked property, but prop () is indeed more consistent with the actual operation behind the attr () notation.
  3. The Boolean property that applies to this point includes: Autofocus, AutoPlay, async, checked, controls, defer, disabled, hidden, loop, multiple, open, ReadOnly, Required, scoped, selected

The JQuery team provides a table of DOM element attributes for attr ()/prop ():

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

jquery check box

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.