Disable odd checkbox of Checkbox list using jQuery

In this post, find jQuery code to disable all the odd checkboxes in Checkbox list. When I say "odd" means checkebox placed at odd index. This can be done easily via ":odd " selector. But there is an interesting thing here. Take a look at below image.

Now as per this image the odd checkboxes are those which are placed at odd location (1, 3 and 5) like "jQuery, Prototype and MooTools". But in case of checkbox list, the index is 0 based. So first checkbox has index 0 and second has 1 and so on..

Related Post:

So to disable odd checkboxes, you need to use ":even " selector.

$(document).ready(function () {
    $("input[name='tech']").filter(':even').attr('disabled', true);
});

And to disable even checkboxes, use ":odd " selector.

$(document).ready(function () {
    $("input[name='hobbies']").filter(':odd').attr('disabled', true);
});

If you see the code then you will find that I have not used ':even ' or ':odd ' selector directly. You can use it but it is not advisable. Because both are jQuery extensions and not part of the CSS specification. Hence queries using ':even ' or ':odd ' cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method.

To achieve the best performance when using ':even ' or ':odd ' to select elements, first select the elements using a pure CSS selector, then use .filter(":odd") or .filter(":even") .

Feel free to contact me for any help related to jQuery, I will gladly help you.



Responsive Menu
Add more content here...