How to set “style=display:none;” using jQuery's attr method?

问题

Following is the form with id msform that I want to apply style="display:none" attribute to.

<form id="msform" style="display:none;">
</form>

Also the check should be performed before adding the "style=display:none;" property. That is if it is already set like in above code it should not set again.

But if it's not set then it should.

How should I achieve this? Please help me.

回答1:

Why not just use $('#msform').hide()? Behind the scene jQuery's hide and show just set display: none or display: block.

hide() will not change the style if already hidden.

based on the comment below, you are removing all style with removeAttr("style"), in which case call hide() immediately after that.

e.g.

$("#msform").removeAttr("style").hide();

The reverse of this is of course show() as in

$("#msform").show();

Or, more interestingly, toggle(), which effective flips between hide() and show() based on the current state.

回答2:

Except hide() mentioned in other answers, you can use css():

$("#msform").css("display","none")

回答3:

$(document).ready(function(){
var display =  $("#msform").css("display");
    if(display!="none")
    {
        $("#msform").attr("style", "display:none");
    }
});

回答4:

You can use the hide and show functions of jquery. Examples

In your case just set $('#msform').hide() or $('#msform').show()

回答5:

Based on the comment we are removing one property from style attribute.

Here this was not affect, but when more property are used within the style it helpful.

$('#msform').css('display', '')

After this we use

$("#msform").show();

回答6:

You can just use: $("#msform").hide(). This sets the element to display: none

回答7:

You can use the jquery attr() method to achieve the setting of teh attribute and the method removeAttr() to delete the attribute for your element msform As seen in the code

$('#msform').attr('style', 'display:none;');


$('#msform').removeAttr('style');

来源：https://stackoverflow.com/questions/27846286/how-to-set-style-displaynone-using-jquerys-attr-method

标签

javascript

jquery

html

css

show-hide