切换不会保持关闭，我必须单击按钮才能关闭切换答案

【问题标题】：toggle does not remain close, i have to click on the button for the toggle to close up切换不会保持关闭，我必须单击按钮才能关闭切换
【发布时间】：2013-06-26 12:12:30
【问题描述】：

    <script type="text/javascript">

    $(document).ready(function(){

    $("#click").click(function () {
    $("#info").slideToggle('slow');
    });

    });

    </script>

这是html代码

        <h4 class="rsvpTitle">


        <a href="#" id="click" class= "blockExpand"> <span class="arrow"></span>RSVP</a>
        </h4>           
        <div id="info" class="expandContent">  

            <form id="formmail method="post" action="form_handler.php">

                <label class="response" for="response">Will you be joining us?</label><br>
                <span style="margin-left:121px;">   
                <input type="radio" name="response" value="I'll be there with bells on!" id="response">I'll be there with bells on!</span>
                <br>

我有这个用于切换效果的代码。但是，切换不会保持关闭状态，我希望切换保持关闭，直到有人单击按钮以释放切换。有任何想法吗？代码写得好吗？

【问题讨论】：

按钮在哪里？？
我认为他的意思是主播
你在我给你的 css 上错过了LOOK

标签： javascript jquery html css toggle

【解决方案1】：

你必须添加显示：无； #info 和 e.preventDefault() 到你的 js

例子： http://jsbin.com/oxuqus/2/ 或 http://jsfiddle.net/kB2fc/

CSS：

#info {
  display: none;
}

JS：

$(document).ready(function(){

  $("#click").on("click", function(e) {
    $("#info").slideToggle('slow');
    e.preventDefault();
  });

});

【讨论】：

【解决方案2】：

只需将其添加到您的 CSS 中

#info {
   display : none;
}

【讨论】：

【解决方案3】：

Working Example

(jsFiddle)

说明

该元素未在文档load 事件中隐藏。您必须在 CSS 中使用 display:none; 隐藏它，以确保它在没有用户交互的情况下不可见。

解决方案

将以下内容添加到您的CSS：

#info
{
    display:none;
}

注意

您没有关闭 input 和 span 元素！添加结束标签：

<input type="radio" name="response" value="I'll be there with bells on!" id="response">I'll be there with bells on!
</input>
</span>

【讨论】：