I am using a simple jquery toogle to show and hide a form. What I am trying to do, is when the toggle is in a close position, print an html message. I have tried various ways, but although the message appears, the form does not show. Only the message toggles. How can I overcome this? Many thanks
jQuery("#fld_company").live('click', function() {
$("#fld_fld").toggle(1000);
});
+++UPDATE+++
<legend id="fld_company">Select Company</legend>
<div id="fld_fld">
<dl>
<dt>
<label for="AUSR_companyname" class="opt">Company Name:</label>
</dt>
<dd>
<input id="AUSR_companyname" name="AUSR_companyname" type="text" size="32" maxlength="128" siz开发者_开发百科e="32" value = "" />
</dd>
</dl>
I have only posted a small section to the html because the markup is identical. There are tags in place also.
I've posted a fiddle here with a working solution.
Essentially, the JS is structured like this:
jQuery("#toggler").live('click', function() { /* toggler is the element that triggers the toggling */
$("#form1").toggle(1000); /* form1 is the form element you want to hide/show */
$("#formMessage").toggle(1000); /* formMessage is the element you want to display when the form is hidden */
});
A key piece to this code is that you will need to set the visibility of form1 and formMessage to be opposite of each other. So, if you want the form1 element to default as visible, then you should include in your css: #formMessage { display: none; }
You do realize that your code is going to toggle the #fld_fld
container if you click on the Select Company label? I am asking this because I don't think that it was intentionally designed to show / hide the form after clicking on a fieldset legend.
BTW, where is the message you are talking about?
精彩评论