make show/hide accessible if javascript is off
$(document).ready(function(){
$("#CO_createAccount").click( function (){
if(this.checked){
$(".CO_accountForm").show();
} else {
$(".CO_accountForm").hide开发者_如何学运维();
}
});
});
and I have the css set for ".CO_accountForm" set to "display:none;"
But, I want the hidden element to be visible if javascript is turned off. I assume I can do this by adding a hidden class the above, but how would I go about this?
Thanks!
Remove the display:none
attribute for the ".CO_accountForm"
and instead hide/set the display:none
attribute via javascript in the document.ready
event.
i.e.:
$(document).ready(function(){
// hide the form using JS so that if the browser
// doesn't support JS then the form is always displayed.
$(".CO_accountForm").hide();
$("#CO_createAccount").click( function (){
if(this.checked){
$(".CO_accountForm").show();
} else {
$(".CO_accountForm").hide();
}
});
});
Why not just add a <noscript> tag around the form in question? This would ensure that the form is displayed since you wouldn't be able to fire off any javascript anyways.
Have element visible by default-- but add a class through jquery which hides them.
精彩评论