All geek questions in one place

JQuery Toggle function doesn't work on first click

I understood the solution to this problem while I was creating the documentation to answer this question ... so I am posting the answer, if for no other reason than to prevent me from wasting time on this in the future

+3
source share
3 answers

toggle()From time to time it’s rather difficult, I had something strange for ticks (removing them) and other problems. I would suggest just handling it with a click event, and moreover with minor annoyances. and so you don’t have to worry about what condition it is in #lowerDiv:

$('#upperDiv').click(function() {
    $('#lowerDiv').animate({
        'opacity' : 'toggle',
    });
});
+2
source

, TOGGLEd, (), , , ,

<html>
<head>
<style>
 #upperDiv {width:200px; height:20px; text-align:center; cursor:pointer; }
 #lowerDiv {width:200px; height:20px; background-color:red; border:#206ba4 1px solid;}
</style>

<script language="Javascript" src="javascript/jquery-1.2.6.min.js"></script>
<script type="text/JavaScript">

$(function(){
$('#upperDiv').toggle (
    function(){ 
        $("#lowerDiv").hide() ; 
        },
    function(){ 
        $("#lowerDiv").show() ; 
        }
); // End toggle
 }); // End eventlistener

</script>
</head>
<body>
<div id="upperDiv" >Upper div</div>
<div id="lowerDiv" >Lover Div</div>
</body>
</html>
+3

I know this is a really old question, but for people looking for a quick fix, this worked for me:

and. in the PHP / HTML file:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/.../jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $("#pClick").click(function(){          
            $("#pText").toggle();
            $("#pText").text("...");
        });
    });
    </script>

b. in the CSS file:

#pText {display: none;}

Now it works even with the first click. This is a simple, quick answer that I hope will be helpful.

0
source

Source: https://habr.com/ru/post/1699537/

More articles:


All Articles