Question

I have a jQuery plugin in my script, which shows and hides any element in html, which is downloaded from here

So in my script, it shows and hides a div, as follow:

<div class="show" rel="#hild<?php echo $r[id]; ?>">
   <button class="action">
        Respond with a new comment
   </button>
</div>

After clicking on this button, the following div is shown:

 <div id="hild<?php echo $r[id]; ?>" style="display:none;">
    <form method="post" name="form">
       <textarea rows="5" cols="35" name="texttcons" id="texttcons"></textarea>
    </form>
 </div>

So, my problem is when I clicked on that button to show the other div, the textarea needs to be focused after completion of the animation.

Please tell me the solution.

Answer 1

You can use trigger():

$('#hild textarea').trigger('focus')

instead of that plugin you can use slideToggle() method:

Display or hide the matched elements with a sliding motion.

$('.show').click(function(){
   var id = $(this).attr('rel')
   $(id).slideToggle('slow', function(){
       $(id).find('textarea').trigger('focus')
   })
})