Twitter-Bootstrap Modal Bindinghandler，如果点击背景，则会出现 Knockout 中断答案

【问题标题】：Twitter-Bootstrap Modal Bindinghandler with Knockout breaking if backdrop is clickedTwitter-Bootstrap Modal Bindinghandler，如果点击背景，则会出现 Knockout 中断
【发布时间】：2013-08-22 18:47:38
【问题描述】：

我正在尝试在单击以下内容时禁用背景关闭模式：

ko.bindingHandlers.showModal = {
    init: function (element, valueAccessor) {
    },
    update: function (element, valueAccessor) {
        var value = valueAccessor();
        if (ko.utils.unwrapObservable(value)) {
            $(element).modal({ backdrop: 'static', keyboard: true });
            // this is to focus input field inside dialog
            $("input", element).focus();
        }
        else {

            $(element).modal('hide');
        }
    }
};

据我了解，$(element).modal({ backdrop: 'static', keyboard: true }); 应该实现我所追求的。但是，如果我单击背景，模式仍然会关闭，实际上会破坏“显示”按钮。我在这里做错了什么？

小提琴：http://jsfiddle.net/PTSkR/175/

【问题讨论】：

标签： twitter-bootstrap knockout.js

【解决方案1】：

你的问题是你试图多次初始化你的模式。

你设置backdrop: 'static'的初始化逻辑应该进入init函数（只调用一次），你需要在你的update函数中调用.modal('show')和.modal('hide')：

ko.bindingHandlers.showModal = {
    init: function (element, valueAccessor) {
        $(element).modal({ backdrop: 'static', keyboard: true, show: false });
    },
    update: function (element, valueAccessor) {
        var value = valueAccessor();
        if (ko.utils.unwrapObservable(value)) {
            $(element).modal('show');
            $("input", element).focus();
        }
        else { 
            $(element).modal('hide');
        }
    }
};

演示JSFiddle.

【讨论】：