jQuery UI switchClass, open/close 相同 div

Question

这是我的第一个问题。

我对 jQuery switchClass 有疑问。我有一个 div（我称之为 div A），当我单击它时，它会更改 html 文本并打开另一个 div（我称之为 div B).当我重新单击 div A 时，我想关闭 div B 并重新更改 div A 上的 html 文本。我设法做到了，但是当我再次单击 div A 时，不再打开 div B。这是我的代码：

$(document).ready(function(){
    $(".button_menu").click(function(){
        $('.menu_contatti').show();
        $('.button_menu').html("So già cosa ordinare....");
        $(this).switchClass("button_menu","button_menu_close");

    $(".button_menu_close").click(function(){
        $('.menu_contatti').hide();
        $('.button_menu_close').html("Non conosci il menù? Clicca qui");
        $(this).switchClass("button_menu_close","button_menu");
        });
    });
});


<div class="input1 button_menu">html text</div>

<div class="menu_contatti" style="display:none;">....</div>

Answer 1

您想使用 .toggle()。请参阅下面的演示

$(document).ready(function() {
    $('.divA').on('click', function() {
        $('.divB').toggle();
        if($('.divB').is(':visible')) {
            $('.divA').html('Close');       
        }
        else {
            $('.divA').html('Open');  
        }
    });
    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="divA">Open</div>
<div class="divB" style="display:none;">This text show and hide</div>

另外，请注意，如果您更喜欢使用类而不是 .toggle()，您应该使用 .addClass() 和 .removeClass()

jQuery UI switchClass, open/close 相同 div

jQuery UI switchClass, open/close same div

jquery

jquery-ui