Question

我有一个带3个按钮的工具栏。其中一个人有一个下拉列表。

html如下：

    <div id="primary-section" class="wrapper wrapper-content">
        <div class="row" id="create-container">
            <div class="col-lg-12">
                <div class="ibox float-e-margins animated fadeInRight">
                    <div class="ibox-title" style="height: 60px;">
                        <div class="btn-group">
                            <button onclick="javascript:vm.createContainer()" class="btn btn-primary" id="newcontainer" style="margin-right:16px;"><i class="fa fa-plus"></i> New Container</button>
                        </div>
                        <div class="btn-group">
                            <button type="button" id="btn-connect" class="btn btn-success" disabled="disabled">Connect</button>
                        </div>
                        <div class="btn-group" id="actions" style="margin-right:16px;">
                            <button id="btn-actions" data-toggle="dropdown" class="btn btn-info dropdown-toggle" aria-expanded="false" disabled="disabled">Action <span class="caret"></span></button>
                            <ul class="dropdown-menu">
                                <li><a>Start</a></li>
                                <li><a>Stop</a></li>
                                <li><a>Pause</a></li>
                                <li><a>Resume</a></li>
                                <li><a>Delete</a></li>
                                <li class="divider"></li>
                                <li><a id="inspect">Inspect</a></li>
                                <li><a id="console">Console</a></li>
                                <li><a>Clone</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="ibox-content">
                        <div id="loading-grid">
                            <img src="/public/img/squares.gif" height="130" width="130" title="Loading" alt="Loading"/>

                            <h3>Loading containers...</h3>
                        </div>
                        <div id="grid" class="hidden"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

现在由于某种原因，由此产生的html如下。创建按钮最终位于连接按钮内部。我无法为我的生活弄清楚到底是怎么回事。看起来我关闭了所有标签和引号。

解析HTML：

<div id="primary-section" class="wrapper wrapper-content">
    <div class="row" id="create-container">
        <div class="col-lg-12">
            <div class="ibox float-e-margins animated fadeInRight">
                <div class="ibox-title" style="height: 60px;">
                    <div class="btn-group">

                    </div>
                    <div class="btn-group">
                        <button type="button" id="btn-connect" class="btn btn-success" disabled="disabled"><button onclick="javascript:vm.createContainer()" class="btn btn-primary" id="newcontainer" style="margin-right:16px;"><i class="fa fa-plus"></i> New Container</button>Connect</button>
                    </div>
                    <div class="btn-group" id="actions" style="margin-right:16px;">
                        <button id="btn-actions" data-toggle="dropdown" class="btn btn-info dropdown-toggle" aria-expanded="false" disabled="disabled">Action <span class="caret"></span></button>
                        <ul class="dropdown-menu">
                            <li><a>Start</a></li>
                            <li><a>Stop</a></li>
                            <li><a>Pause</a></li>
                            <li><a>Resume</a></li>
                            <li><a>Delete</a></li>
                            <li class="divider"></li>
                            <li><a id="inspect">Inspect</a></li>
                            <li><a id="console">Console</a></li>
                            <li><a>Clone</a></li>
                        </ul>
                    </div>
                </div>
                <div class="ibox-content">
                    <div id="loading-grid">
                        <img src="/public/img/squares.gif" height="130" width="130" title="Loading" alt="Loading"/>

                        <h3>Loading containers...</h3>
                    </div>
                    <div id="grid" class="hidden"></div>
                </div>
            </div>
        </div>
    </div>
</div>

Answer 1

好的孩子们，下次你发布到SO时记得，先检查一下javascript。

我在连接按钮的元素id上添加了按钮。

谢谢大家！

按钮最终在彼此之内

1 个答案: