Question

我有一个按钮：

<button type="button" class="btn btn-sm btn-primary" data-bind="attr: { 'data-target': '#MoreOptions' + Provider() }" data-toggle="collapse">More Options</button>

控制何时打开或关闭此div以显示更多选项＆＃39;。

<div class="panel-collapse" data-bind="attr: { id: 'MoreOptions' + Provider() }, css: { collapse: $root.IsCollapsed }">---</div>

当数据在div内刷新时，我使用Knockout.js observable来保持打开状态。我不想要数据刷新来折叠div。问题是，当我这样做并保持div打开时，按钮认为div已关闭。因此，下次用户单击按钮时，div会快速关闭并再次打开，需要两次单击按钮才能关闭div。

预期的行为是在数据刷新期间保持div打开，但让按钮知道div是打开的，只需单击一下即可关闭它。

我已经在div中使用knockout设置了CSS崩溃，我正在寻找一种类似的方法来设置按钮，让它知道div没有崩溃。

我注意到，当单击按钮展开div时，aria-expanded属性设置为true，在最初呈现按钮时它不存在;当单击按钮以折叠div时，CSS属性“折叠”了＃39;被添加到按钮。我通过淘汰赛添加和更改这些并没有成功。

应该注意按钮是用数据刷新的。

Answer 1

我已决定删除引导切换按钮功能，只需将jQuery切换与knockout结合使用即可。 jQuery方式只提供更多控制。

export LD_LIBRARY_PATH=/usr/local/gcc-5.3.0/lib:/usr/local/gcc-5.2.0/lib64:$LD_LIBRARY_PATH

淘汰赛：

<button type="button" class="btn btn-sm btn-primary" 
        data-bind="click: $root.ChangeMoreOptions">
    More Options
</button>

<div id="MoreOptionsDiv" style="padding-top: 10px; display: none;">
--- content ---
</div>

改变bootstrap切换按钮的状态

1 个答案: