Search jQuery

jQuery Forum

FadeOut on id tags?

in Using jQuery • 10 years ago

Hi I'm trying to fade out a textbox and a <p> when I click on a Submit button with the id= 'sub_btn'. Is this the proper code or do I need to possible reference the div the 'sub_btn' is in which is called id='inputarea'? Or possible the type of input? I've only seen people use the click(function()..... on something like 'a'.

Code:

function clearExtra(){
$('#sub_btn input').click(function(){
$('#input').fadeOut('fast');
$('#dir').fadeOut('fast');
});
});

Thanks for the help!

Replies(6)

jakecigar

Re: FadeOut on id tags?

10 years ago

if sub_btn is the id of the submit button, you code

$('#sub_btn').click(function(){

But it may do the form submit and send you to the result page before the fields are completely faded out.

JΛ̊KE

verber001

Re: FadeOut on id tags?

10 years ago

Ok. That is how I originally had it and it wasn't functioning. The results are produced on the same page I have a div for the area that needs to fade and one for the area that the results are displayed. Here's the jquery code:

function clearExtra(){
$('#sub_btn').click(function(){
$('#input').fadeOut('fast');
$('#dir').fadeOut('fast');
});
});

And the code for the html:

<body>
<div id="header">Word Cloud</div>
<div id="inputbox">
<p id="dir" style="color: orange">Copy and paste some code into the text box!</p>
<textarea id="input" row="20" col="1" ></textarea></div>
<div id="buttons"><input type="button" id="sub_btn" onClick= "execute()" value="Submit"/>         <input type="button" onClick="window.location.reload()" value = "Reset" /></div>
<p style="text-align: center">All text within the word cloud are clickable and will open a google search on the word</p>
<div id="display"></div>
</body>

jakecigar

Re: FadeOut on id tags?

10 years ago

Are you calling clearExtra when the dom is ready? As in:

$(clearExtra)

$(function(){
clearExtra()
})

I don’t know what onClick= "execute()" is doing, but get rid of it!

JΛ̊KE

verber001

Re: FadeOut on id tags?

10 years ago

On execute() parses the text and then displays it as a word cloud. clearExtra() the jQuery function is called within execute(). And I am calling 'clearExtra()' not $(clearExtra) should I switch it? Well let me switch to the following and see how that works: