Question

我有几个动态创建的按钮，下面有一个切换框，就像这样创建。

HTML

<button type="button" class="accordion-toggle btn btn-default btn-small" 
data-toggle="collapse" data-parent="#accordion'+this.id+'" 
href="#collapseOne'+this.id+'"><i class="icon-info"></i></button>

以下是单击

时调用的文本框折叠

<div id="accordion'+this.id+'">
    <div id="collapseOne'+this.id+'" class="collapse" style="height: auto;">
        <div class="control-group control-group-notes">
            <button onclick="clearMsgBox(\''+this.id+'\')" type="button" class="close" data-toggle="collapse" data-parent="#accordion'+this.id+'" href="#collapseOne'+this.id+'">x</button>
            <textarea id="doGet'+this.id+'" style="width: 92%;" rows="2" placeholder="Message..."></textarea>
        </div>
    </div>
</div>

按钮和方框是动态创建的，工作正常。我似乎无法弄清楚的唯一问题是，在加载时，所有框都是打开的而不是隐藏的。但是一旦我点击x按钮，它就会切换到隐藏得很好。

有人可以帮帮我吗？提前谢谢。

Answer 1

在bootstrap中，class =“in”决定了手风琴的可见度，并且在加载时可能会出现在所有手风琴上。

class="panel-collapse collapse in"

对于那些你不想显示onload的人，请删除“in”类。

Answer 2

解决！

如果有人想知道导致它的原因。

如上所述，课堂上需要删除。还有一个高度自动需要删除。

代码如下。

<div id="accordion'+this.id+'">
    <div id="collapseOne'+this.id+'" class="collapse">
        <div class="control-group control-group-notes">
            <button onclick="clearMsgBox(\''+this.id+'\')" type="button" class="close" data-toggle="collapse" data-parent="#accordion'+this.id+'" href="#collapseOne'+this.id+'">x</button>
            <textarea id="doGet'+this.id+'" style="width: 92%;" rows="2" placeholder="Message..."></textarea>
        </div>
    </div>
</div>

Answer 3

如果您希望div在加载时隐藏，可以尝试设置：“display：hidden;”在你的CSS中为这个div。然后，切换功能将通过更改显示属性在点击时显示。（至少这是它如何与jquery一起工作）

如何在加载时隐藏Bootstrap文本框切换

3 个答案: