jQuery - How to select by attribute

Question

I have a HTML like this,

<a id="a_1" href="#" disabled_onclick="true">Link1</a>
<a id="a_2" href="#">Link2</a>
<a id="a_3" href="#" disabled_onclick="true">Link3</a>
<input id="b_1" type="submit" disabled_onclick="true">Button1</input>
<input id="b_2" type="submit">Button2</input>
<input id="b_3" type="submit">Button3</input>

Now I need write a jQuery which returns me all the attributes in my html having a disabled_onclick property set to true. In this case, I should get 3 elements, two link tags and one input tag.

Answer 1

Here’s how to select all those elements:

$('[disabled_onclick="true"]');

Since true is a valid unquoted attribute value in CSS, you could even omit the quotes:

$('[disabled_onclick=true]');

If you care about valid HTML you should consider using a custom data-* attribute instead though.

<input id="b_1" type="submit" disabled_onclick="true">
<!-- …becomes… -->
<input id="b_1" type="submit" data-disabled-onclick="true">

That way it’s valid HTML, and you’ll still be able to select it as follows:

$('[data-disabled-onclick="true"]');

Answer 2

try this

$('[disabled_onclick="true"]')