敲除选项卡绑定

Question

我有两个标签的HTML部分.聋人正在工作,但是当我试图打开另一个标签时,我收到了一个错误.有人可以帮忙吗？

HTML

<ul class="nav nav-tabs" data-bind="tabs: true" id="myTabs">
    <li class="active"><a href="#first">First</a></li>
    <li><a href="#second">Second</a></li>
</ul>
<div class="tab-content">
    <div class="tab-pane active" id="first">
        <div class="form-group">
            <label class="control-label"></label>
        </div>
    </div>
    <div class="tab-pane" id="second">
        <div class="form-group">
            <label class="control-label"></label>
        </div>
    </div>
</div>

JS

ko.bindingHandlers.tabs = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).find('a').click(function (e) {
            e.preventDefault();
            $(e.target).tab('show');
        });
    }
};

我收到错误:未捕获TypeError:对象[object Object]没有方法'tab'

Answer 1

你在使用jquery-ui标签吗？如果是这样,试试这个:HTML

<div data-bind="tabs: true" id="myTabs">
        <ul>
            <li class="active"><a href="#first">First</a></li>
            <li><a href="#second">Second</a></li>
        </ul>
        <div id="first">
            <div>
                aa
            </div>
        </div>
        <div id="second">
            <div>
                bb
            </div>
        </div>
    </div>

JS

ko.bindingHandlers.tabs = {
    init: function (element, valueAccessor, allBindingsAccessor, viewModel) {
        $(element).tabs();
        ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
          $(element).tabs("destroy");
        });
    }
};