jQuery: show() keeps adding display:block

I'm having a little issue right now that has turned into a festering wound.

I've recreated Google Business Hours for setting which hours during the week that a company is open, or whether they are closed on that day. Now, if they are closed, the user can select a checkbox and the times DIV hides. Right now I'm using .show() and .hide()

Now, let's say that a user closes the first day and decides to "apply all" to the rest of the days of the week. I loop through and close the remaining 6 days. However, if a user has modified a day in the middle of the week, the .show() or .hide() functions automatically add "display: block" and this messes up the loop.

Why is jQuery adding this styling when it was never there originally, and is there a clean way of 开发者_Python百科removing it within a loop before I apply the .show() or .hide()?

---

On an element that you haven't defined the display, after unhidding it, JQUERY will add display block to the element.

You can remove it afterwards.

$("#myrow").show().removeAttr( 'style' )

This includes all dynamic styling so please watch out if you depend on this.

---

Use jQuery's addClass() and removeClass() if you're not happy with the effect of show() and hide(), and attach a class to change the visibility, for example.

---

http://api.jquery.com/show/

The matched elements will be revealed immediately, with no animation. This is roughly equivalent to calling .css('display', 'block'), except that the display property is restored to whatever it was initially. If an element has a display value of inline, then is hidden and shown, it will once again be displayed inline.

Do you have an original css display property set?

---

Jquery uses 'display:none' to hide().I use this and show() quite frequently but I haven't had any problem yet probably because display:block hasn't hurt my formatting.

Here's a quick remedy for your situation

$("#mydiv").show().css("display","inline")

Use the div setting you want instead of inline (while inline will probably work for you considering block isn't.

---

Like Cyril Gupta's and Jimmy Kane's answers, use this on a hidden div:

$("#hiddenDiv").css("display","");

This simply clears the "none" from display, your stylesheet should take over from there.