隐藏使用敲除的外部点击div？

如何隐藏使用knockout.js外面点击一个div ...我已经试过，但没有成功..隐藏使用敲除的外部点击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());

Here is fiddler example:

来源

2013-03-21 Imran Rashid

既然你想要只有当用户点击除div以外的任何地方时，才会隐藏div，您必须将stopPropagation()添加到div的点击事件，以及按钮的单击事件，否则主体的点击事件将立即触发，每次尝试时都会隐藏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"/>

和工作fiddle

来源

2013-03-21 16:49:08 jonhopkins

没有我想隐藏，如果用户点击，除了特定的div – 2013-03-21 16:49:54

上文件的任何地方改变了答案做你想做的事。 – jonhopkins 2013-03-21 17:01:15

感谢您的详细解答！ – 2013-03-21 17:31:24

隐藏使用敲除的外部点击div？

回答

相关问题