Question

我在创建文档时已经意识到这个问题的解决方案问这个问题...所以如果没有其他原因我会发布答案，而不是让我在将来浪费时间

Answer 1

如果在呈现页面时显示（可见）要进行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>

Answer 2

toggle()有时候非常错误，我已经检查过标记（取消选中）以及其他各种问题。我建议只使用点击事件处理它，更不用说轻微的烦恼了。这样，您就不必担心状态#lowerDiv首先处于什么状态：

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

Answer 3

我知道这是一个非常古老的问题，但对于那些正在寻找快速解决方案的人来说，这对我有用：

一个。在PHP / HTML文件中：

<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>

湾在CSS文件中：

#pText {display: none;}

现在即使在第一次点击也能正常工作。这是一个简单，快速的答案，我希望它会有用。

jQuery Toggle功能在第一次单击时不起作用

3 个答案: