问题
In my ASP.NET web application, I have some elements that may be disabled in code-behind and some elements may be disabled in JavaScript.
For the code-behind elements, I simply use the following VB.NET property:
Me.element1.Enabled = False
For the dynamic elements, I use the following JavaScript property:
document.getElementById('" & Me.element2.ClientID & "').disabled = true;
The first thing I noticed is that changing the Enabled property doesn't just add disabled="disabled" to the markup, it also changes the class from button (my skinned class name for buttons) to button aspNetDisabled. To compensate for this, I include the following additional JavaScript line:
document.getElementById('" & Me.element2.ClientID & "').className = 'button aspNetDisabled';
(Clearly, this means I need to maintain the className attribute if/when I enable the element again, and I'll need to ensure I use button/textbox/etc. as applicable - For bonus points, if you have any recommendations about this, I'd be happy to hear them)
However, I also noticed that the markup produced via JavaScript is only disabled="", whereas the markup produced by the ASP.NET Enabled property change is disabled="disabled".
I tried fiddling with the JavaScript to change it to:
document.getElementById('" & Me.element2.ClientID & "').disabled = 'disabled';
However, this didn't seem to make a difference, with the attribute still being empty. Interesting that disabled=true; and disabled='disabled'; seem to work in the same way - I expect one of them is more correct (I'm sticking to =true; for now).
Is there a recommended best way of achieving the same results with JavaScript as with server-side ASP.NET with regards to enabling and disabling elements?
and...
Is the difference between the rendering of disabled="disabled" and disabled="" likely to cause me any problems?
回答1:
The value of the disabled property doesn't matter, it is implied http://www.w3.org/TR/html401/interact/forms.html#h-17.12.1
There is some strangeness going on though.
var my_elem = document.getElementById('my_elem');
elem.disabled = true; // disabled
elem.disabled = false; // enabled
elem.disabled = "false"; // disabled
The strange case is
elem.disabled = ""; // disabled
Normally "" is falsy (as in "" == false is true).
I would recommend you use a framework to set these properties to catch any browser specific behavior. For disabled there isn't much strife but properties like opacity don't work the same in all browsers.
回答2:
The disabled attribute doesn't have to have a fixed value - it used to work without ANY value (e.g. <input type=text disabled>) but this caused some validation problems. If you're already using jquery in your project, you can use something like:
$('#elementname').removeAttr('disabled').removeClass('aspNetDisabled'); // Enable
and
$('#elementname').attr('disabled').addClass('aspNetDisabled'); // Disable
The difference between disabled="disabled" and disabled="true" does not matter.
来源:https://stackoverflow.com/questions/11931762/javascript-disabled-true-vs-asp-net-enabled-false