Weird bug in Firefox using disabled="disabled"

StackOverflow https://stackoverflow.com/questions/23472207

Question

I nibbling on a bug in ff:

See http://nocturne.wmw.cc/bugff.html (not reproducable in jsfiddle - too bad)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  </head>
<body>
 <button disabled="disabled">sdf</button>
 <script>
  jQuery(function(){
    if(!jQuery('button').is(':disabled'))
      alert('Is not disabled!');
    jQuery('button').removeAttr('disabled');
  });
</script>
</body>
</html>

Now the Problem:

  1. If i load the first time, everything is ok.
  2. If i reload the page using Ctrl+r, the alert() shows the error-message.
  3. If i Reload using Ctrl+Shift+r the bug does not occoure.

I do use Microsoft® Windows® 7. Reproduceable at least at FF28, FF29.

How to solve?

Was it helpful?

Solution

The issue seems to be the same mechanism that stores user-input for form-elements, the state of the button has been cached.

possible solution(see: How can I stop Firefox from caching the contents of a textarea on localhost? ): 

<button disabled="disabled" autocomplete="off">sdf</button>

http://jsfiddle.net/doktormolle/4ZLd9/show/

OTHER TIPS

Just try disabled instead of disabled = "disabled"

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  <body>
    <button disabled>sdf</button>
    <script>
      jQuery(function(){
        if(!jQuery('button').is(':disabled'))
         alert('Is not disabled!');
       jQuery('button').removeAttr('disabled');
      });
     </script>
  </body>
</html>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top