Question

我正在使用EasyTabs插件（http://os.alfajango.com/easytabs）和KnockoutJS。我有一个面板，当没有可用的项目时，不能显示。所以我把以下代码：

<div data-bind="if: machine() !== null">

此div包含选项卡容器。当机器可用时。面板可见。但标签不起作用。您可以单击它，浏览器的地址栏显示所单击标签的名称，但标签窗口不会更改。

当我擦除div中的数据绑定时。它有效，但当然，面板是可见的，这不是我想要的。

已知问题或是否有可用的解决方法？

修改： http://jsfiddle.net/jurgenstillaert/fdt8d/

Answer 1

问题是EasyTabs不会对标签做任何事情，除非在容器元素上调用了easytabs()。由于该元素在if绑定成功之前实际上不会成为DOM的一部分，然后在失败时从DOM中消失，因此初始化永远不会发生。

您需要编写一个自定义绑定，在easytabs()方法的相应容器元素上调用update。

Answer 2

根据你的jsFiddle，我修理了这个：

<div id="cntrMyTabs" class="tab-container" data-bind="visible: isShow">
   <ul class='etabs'>
      <li class='tab'><a href="#tab1">Tab 1</a></li>
      <li class='tab'><a href="#tab2">Tab 2</a></li>
   </ul>
   <div id="tab1" class="panel-container">
       This is tab 1.
    </div>
    <div id="tab2" class="panel-container">
       This is tab 2.
    </div>
</div>

注意外部div已经消失，并且添加了可见的数据绑定。之所以这样，你的内容不是因为你的内部html不是DOM的一部分而且正如其他人所说的那样，当你复选它时它不会成为easytabs。有了这个，这就是DOM的一部分，只是隐藏了。

EasyTabs和KnockoutJS冲突

2 个答案: