Question

我遇到了一个有趣的困境。我正在尝试创建一个可折叠的div来保存我的数据，到目前为止它不起作用。我认为可能是jquery给了我我的噩梦但是在将它引用到Google之后我仍然遇到了同样的问题。一旦我点击折叠/展开。它没有做任何事情。你们有什么不对劲吗？

 <div class="panel-group" id="accordion" style="margin-top: 15px">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Complete Database Export</a>
                <small style="margin-left: 10px">(click here)</small>
            </h4>
        </div>
        <div id="collapseOne" class="panel-collapse collapse in">
            <div class="panel-body">

                <div class="row" style="text-align: center; margin-top: 10px">
                    <asp:Label runat="server" CssClass="label">Complete Database Export</asp:Label>
                    <table style="width: 100%; margin-top: 10px">
                        <tr>
                            <td>
                                <p class="fg-color-grey">Enter the email addresses where the report will be sent to, seperated by commas:</p>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: center">
                                <asp:TextBox ID="txtDumpEmails" runat="server" CssClass="genericTextBox widthOverride"></asp:TextBox>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <asp:Button ID="btnDump" runat="server" Text="Generate Complete Database Export" CssClass="simpleButton marginOverride" OnClick="btnDatabaseDump_Click" />
                            </td>
                        </tr>
                    </table>

                </div>

            </div>
        </div>
    </div>
  </div>

有什么我可以尝试检查或忘记了吗？提前致谢。我此刻对此感到非常沮丧。

修改的

我还应该注意，我在Web检查器控制台中没有出现任何错误。

Answer 1

好的，您拥有的代码将进行折叠/展开，但它位于链接上，即

<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Complete Database Export</a>

而不是以下代码：

<small style="margin-left: 10px">(click here)</small>

放大屏幕截图

Expanded

折叠屏幕截图

Collapsed

如果选择'完整数据库导出'链接，则不需要检查所有引导资源文件是否正确加载。

我猜想丢失的js文件可以通过引用cdn来测试。

<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

data-toggle =“collapse”在点击时不会折叠我的数据

1 个答案: