.toogle（），但在2或3上单击

Question

Wordpress personnal project, I'm a bit disapointed :

I have created a button and a div from shortcode (function.php):

(into my shortcode function)

echo '<br /><br /><br /><button id="button_detail_sc2" onclick="showhide_detail_sc2()">Take a look on the div</button><br />';
echo '<div id="resume_quest_sc_2">XXXXXXXX</div>';

I made a function for hide/display the div

function showhide_detail_sc2()
{
jQuery("#button_detail_sc2").click(function() {jQuery("#resume_quest_sc_2").toggle();  });}

Everything works fine BUT I have to click 3 time on the button to hide the div the first time, and after have to click 2 time to display or hide again the div.

I don't understand, I just want to hide/display on 1 click everytime.

Could you help me ?

Answer 1

The function jQuery("#button_detail_sc2").click(...) adds an event handler for the click event on your button. That is not necessary since you are using the onclick attribute, so the function showhide_detail_sc2() gets executed every time the button is clicked.

Try executing the toggle command directly:

function showhide_detail_sc2()
{
    jQuery("#resume_quest_sc_2").toggle();
}