Setting a boolean attribute with jquery

Question

I understand that jquery will allow you to modify attributes with the .attr() method. There are basically two methods:

$('#element').attr('attribute', 'value') // sets the attribute
var attribute = $('#element').attr('attribute') // gets the attribute

My question is, how do you set a boolean attribute such as 'checked' on a checkbox or 'multiple' on a select tag?

I've tried doing the following without success:

$('#element').attr('attribute', true)
$('#element').attr('attribute', '')

All of these add the attribute but usually like this <tag attribute="attribute">.

Selvakumar Arumugam · Accepted Answer · 2012-10-17 18:19:11Z

23

Try using .prop to deal with boolean that is for supported attributes like selected/disabled/checked e.t.c

$('#element').prop('attribute', true);

from jQuery docs, (an example)

elem.checked returns true (Boolean) Will change with checkbox state

$(elem).prop("checked") returns true (Boolean) Will change with checkbox state

elem.getAttribute("checked") returns "checked" (String) Initial state of the checkbox; does not change

$(elem).attr("checked")(1.6) returns "checked" (String) Initial state of the checkbox; does not change

$(elem).attr("checked")(1.6.1+) returns "checked" (String) Will change with checkbox state

$(elem).attr("checked")(pre-1.6) returns true (Boolean) Changed with checkbox state

answered Oct 17, 2012 at 18:19

Selvakumar Arumugam

79.9k15 gold badges123 silver badges139 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Oskar Berggren Over a year ago

prop() sets the property, attr() sets the attribute. It is not always correct to "just use prop() instead".

Gideon Babu · Accepted Answer · 2019-12-03 12:19:27Z

1

I use this method in jQuery

jQuery('option').attr("selected", "");

or in JavaScript:

document.querySelector("option").setAttribute("selected", "");

It's just you need to pass an empty string to just set boolean attribute.

answered Dec 3, 2019 at 12:19

Gideon Babu

3662 gold badges5 silver badges11 bronze badges

Comments

ilan berci · Accepted Answer · 2012-10-17 18:20:17Z

-1

HTML attributes are always string values. If you indeed want to set something other than a string, then please consider using jQuery.data()

answered Oct 17, 2012 at 18:20

ilan berci

3,8791 gold badge18 silver badges21 bronze badges

2 Comments

Chad Kapatch Over a year ago

Not true in HTML5: dev.w3.org/html5/spec/…

ilan berci Over a year ago

You are right, I shouldn't have made that assumption... apologies

Collectives™ on Stack Overflow

Setting a boolean attribute with jquery

3 Answers 3

1 Comment

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related