Question

For some reason a <form> on my page won’t hide/show using jQuery. I have other things in my form, like <div>s and <table>s, but I’ve isolated it down to these two input fields that are breaking it:
http://jsfiddle.net/3SDvm/2/

<form>
    <div>Random text</div>
<input id="multi" type="radio" name="style" value="checkbox"/>
    <label for="multi">Multiple options</label>

<input id="single" type="radio" name="style" value="radio" />
    <label for="single">Single option</label>
</form>​

$(document).ready(function() {
   $('form').slideUp(); 
});​

Is this normal behavior, or is there something I’m doing wrong? Tested on Chrome/IE/FF/Safari..

Answer 1

Any time you use a name for a form field that matches a property or method of the parent form itself, this can happen. That includes style, but also id, action, submit, length, etc. jQuery attempts to work around this but there are still situations where it can occur. For more technical detail see here: http://kangax.github.com/domlint/