Imr*_*hid 1 jquery knockout.js
如何使用knockout.js隐藏外部点击的div ...我试过这个但没有成功..
HTML:
<body>
<div data-bind="visible: show">
<h3>hello world</h1>
</div>
<input type='button' data-bind="click: showBox" value="show"/>
<body>
脚本:
var viewModel = function()
{
self = this;
self.show = ko.observable(false);
self.showBox = function(){
self.show(true);
$("body").one("click", function(){
self.show(false);
});
};
}
ko.applyBindings(new viewModel());
由于你只想在用户点击div的任何地方时隐藏div,你必须添加stopPropagation()div的click事件,以及按钮的click事件,因为否则body的click事件会立即触发,每次隐藏div您尝试单击按钮的时间.请注意,这将使得在显示div时单击按钮不会使div被隐藏...您还需要移动$("body").on("click"...到showBox之外.
该模型:
var viewModel = function()
{
self = this;
self.show = ko.observable(false);
self.showBox = function(){
self.show(true);
};
$("body").on("click", function(){
self.show(false);
});
}
ko.applyBindings(new viewModel());
HTML:
<div data-bind="visible: show, click: function(data, event) { event.stopPropagation(); }">
<h3>hello world</h1>
</div>
<input type='button' data-bind="click: function(data, event) { showBox(data); event.stopPropagation(); }" value="show"/>
还有一个工作小提琴