Javascript 如何使手风琴菜单打开按钮点击?

Javascript 如何使手风琴菜单打开按钮点击?,javascript,jquery,css,Javascript,Jquery,Css,我想在点击“更多”按钮时打开手风琴菜单。我试过了,但它在第一个状态显示手风琴,当我点击按钮时,它崩溃了。我想要的是打开手风琴按钮点击和第一个国家,它应该关闭 请引导我 <input id="hide" value="+" src="./img/Mainpage-more-icon.png" type="button" /><br/> <div id="rightMenu"> <ul> <li>sss</li

我想在点击“更多”按钮时打开手风琴菜单。我试过了,但它在第一个状态显示手风琴,当我点击按钮时,它崩溃了。我想要的是打开手风琴按钮点击和第一个国家,它应该关闭

请引导我

<input id="hide" value="+" src="./img/Mainpage-more-icon.png" type="button" /><br/>
<div id="rightMenu">
    <ul>
        <li>sss</li>
        <li>sss</li>
        <li>sss</li>
    </ul>
</div>
<script>
    $(document).ready(function() {
        $('#hide').click(
                function() {
                    //show its submenu
                    $("#rightMenu").stop().slideToggle(500);
                }
        );
    });
</script>

  • sss
  • sss
  • sss
$(文档).ready(函数(){ $(“#隐藏”)。单击( 函数(){ //显示其子菜单 $(“#右菜单”).stop().slideToggle(500); } ); });
您可以将其添加到您的
就绪中

$("#rightMenu").hide();

或者将它的css样式设置为
display:none

您可以将其添加到您的
ready

$("#rightMenu").hide();

或者将其css样式设置为
display:none

在开始时将其设置为
slideToggle


请注意,我甚至不知道完整的JQuery,,但这是一个简单的知识,你可以在

上找到,让它成为
幻灯片切换


请注意,我甚至不知道完整的JQuery,但这是一个简单的知识,你可以在

设置
显示:无
css中

<input id="hide" value="+" src="./img/Mainpage-more-icon.png" type="button" /><br/>
<div id="rightMenu" style="display:none;">
<!--------------------^-------^--------->   
    <ul>
        <li>sss</li>
        <li>sss</li>
        <li>sss</li>
    </ul>
</div>
<script>
    $(document).ready(function() {
    $('#hide').click(
            function() {
                //show its submenu
                $("#rightMenu").stop().slideToggle(500);
            }
       );
  });
</script>

在css中设置
显示:无

<input id="hide" value="+" src="./img/Mainpage-more-icon.png" type="button" /><br/>
<div id="rightMenu" style="display:none;">
<!--------------------^-------^--------->   
    <ul>
        <li>sss</li>
        <li>sss</li>
        <li>sss</li>
    </ul>
</div>
<script>
    $(document).ready(function() {
    $('#hide').click(
            function() {
                //show its submenu
                $("#rightMenu").stop().slideToggle(500);
            }
       );
  });
</script>

您只需调用$(“#rightMenu”).hide()。。。或者用css隐藏它

请参阅此代码笔:

您只需调用$(“#rightMenu”).hide()。。。或者用css隐藏它

请参阅此代码笔:

@sanduni\u fdo欢迎你,这是你想要的吗?因为你一开始一定想把它藏起来?:是的,就是这个。我想显示按钮在第一个实例,一旦它点击只有手风琴应该显示。您的小提琴演示对我来说很好。@sanduni_fdo那么这是正确的答案还是您标记为正确的答案?两者都是相同的对,我检查了Pranav Ram的小提琴演示,它也显示了相同的结果result@sanduni_fdo不客气,这是你想要的吗?因为你一开始一定想把它藏起来?:是的,就是这个。我想显示按钮在第一个实例,一旦它点击只有手风琴应该显示。您的小提琴演示对我来说很好。@sanduni_fdo那么这是正确的答案还是您标记为正确的答案?两者都是相同的对,我检查了Pranav Ram的小提琴演示,它也显示了相同的结果