I have the a page where I'm trying to use .toggle on a div.
Everywhere I've tested works fine except IE.
$(document).ready(function(){
$("p.advanced a").click(function(){
$(this.parentNode.nextSibling.nextSibling).toggle();
if(this.innerHTML == "[+] Advanced") {
$(this).html("[-] Advanced");
} else {
$(this).html("[+] Advanced");
}
});
});
The markup:
</div>
<div id="content">
<h3>Header1</h3>
<label>Text Input 1</label><input type="text" />
<label>TI2</label><input type="text" />
<label>COMBOBOX</label><select><option>a</option></select>
<p class="advanced">
<a href="#">[+] Advanced</a>
<div class="sme" style="display: none;">
<label>Text Input 1</label><input type="text" />
<label>TI2</label><input type="text" />
<label>COMBOBOX</label><select><option>a</option></select>
</div>
<h3>Header2</h3>
<label>Text Input 1</label><input type="text" />
<label>TI2</label><input type="text" />
<label>COMBOBOX</label><select><option>a</option></select>
</div>
What is happening is the second form section (<h3>Header2</h3> and
onwards) is getting hidden. The outer div (id="content") isn't being
expanded to contain it.
Has anyone encountered this, or does anyone know a fix for it?
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/