Skip to main content

Search and Top Navigation

#5951 closed bug (duplicate)

Opened August 15, 2010 06:43AM UTC

Closed May 17, 2011 03:24PM UTC

Last modified October 11, 2012 09:15PM UTC

Button from A tag can't be disabled

Reported by: vs-pvt Owned by:
Priority: major Milestone:
Component: ui.button Version: 1.8.4
Keywords: Cc:
Blocked by: Blocking:
<a id="button" href="#">Disabled button</a>
<script type="text/javascript">
  jQuery('#button').button({ disabled: true });

UI generates button but it's can't be disabled.

Invoking method .button('disable') do nothing too (((

Attachments (0)
Change History (11)

Changed August 19, 2010 04:50AM UTC by watanabe comment:1

It seems to need something like this:

 $("#button").click(function () {
  if ($(this).attr("disabled")) return false;

Changed September 06, 2010 01:41AM UTC by vs-pvt comment:2

I need initialy disabled button with disabled state by using native UI methods.

This workaround only prevents click action.

Changed September 06, 2010 06:39AM UTC by watanabe comment:3

  • The "A" element seems to have no "native" UI method to prevent click action.
  • The "BUTTON" element seems to have the "disabled" attribute to prevent click action.

In IE8, when disabling the "A" element, the element seems to be grayed out, do not receive focus, but can be clicked.

Changed September 07, 2010 02:03AM UTC by fastfasterfastest comment:4

I am running into this problem as well - but only in Firefox.

If I turn an "A" element into a jQuery UI button, then disable the button, then click on the button then:

  • in IE8, the buttons click event handler will not be invoked (good)
  • in Firefox 3.6.8, the buttons click event handler will be invoked (bad)

Same behavior is experienced if the button is disabled with .attr("disabled", "disabled").

Here is my sample code:

<a href="#" id="a1">Test</a>

<script type="text/javascript">

$(function() {

$('#a1').button().button("option", "disabled", true).click(function() { alert("clicked") });



Changed September 07, 2010 03:12AM UTC by watanabe comment:5

It seems the "disabled" attribute of the "A" element does not prevent the click action

in IE8.0.6001.18943, Chrome 6.0.472.53, Safari 3.2.2(525.28.1), Firefox 3.6.6, Opera 10.53.

<a href="about:blank" id="a1" target="_blank" onclick="alert('obtrusive')" disabled="disabled">Test</a>

But it seems ".button({ disabled: true })" prevent the click action in IE8, not in other browsers.

$('#a1').button({ disabled: true });

jQuery( or jQuery UI) code may prevent the click action in IE8.

The "disabled" attribute of the "A" element (half-implemented in IE) may have something to do with this behavior.

alert( $("#a1").attr("disabled") === true )
  • In IE8, this code shows "true".
  • In other browsers, this code shows "false".

Changed September 09, 2010 04:34AM UTC by watanabe comment:6

jQuery UI code may prevent the click action in IE8.

<A class="ui-button" disabled="disabled" onclick="alert('obtrusive')" href="about:blank" target="_blank">test</A>

Changed October 19, 2010 03:36PM UTC by scottgonzalez comment:7

priority: criticalmajor

Changed May 17, 2011 03:01PM UTC by davidmurdoch comment:8

I could not reproduce this issue with jQuery UI 1.9pre Live from Git Tue May 17 14:55:04 UTC 2011.

Changed May 17, 2011 03:24PM UTC by scottgonzalez comment:9

resolution: → duplicate
status: newclosed

Changed May 17, 2011 03:24PM UTC by scottgonzalez comment:10

Duplicate of #5945.

Changed October 11, 2012 09:15PM UTC by scottgonzalez comment:11

milestone: TBD

Milestone TBD deleted