Rails，Popups，Ajax删除和stopPropagation

Question

我有一个rails项目，在弹出窗口中有一个标准的rails删除链接。

我在页面上有多个弹出窗口，因此我有一个隐藏操作附加到正文（onclick），并且 stopPropagation事件附加到弹出窗口，以便在弹出窗口内单击不隐藏它，但点击其他任何地方都会隐藏所有弹出窗口。

然而，这似乎正在影响我的删除链接，这些链接位于弹出窗口内。它似乎迫使他们取代而不是发帖，这意味着他们不会删除。并且不会出现确认对话框。

如果我在弹出窗口之外移动删除链接，它会按预期工作。

一些代码：

$('body').click(function() {
    $('.popover').hide();
});
$('.popover').click(function(ev){
    ev.stopPropagation();
});

导轨（Haml）查看：

.popover
    = link_to [task], :confirm => 'Are you sure you want to delete?', :method => :delete, :remote => true

如何使用stopPropagation删除在父级内部工作？

感谢帮助。

Answer 1

将jQuery .not()函数与CSS *选择器结合使用：

$('body *').not('.popover, .popover *').click(function() {
    $('.popover').hide();
});

完整文档：http://api.jquery.com/not/

使用JSFiddle：http://jsfiddle.net/ryanbrodie/nGcaP/7/

Answer 2

它不起作用的原因是因为这些行。

$('.popover').click(function(ev){
   ev.stopPropagation();
});

他们停止在弹出窗口内点击的任何内容上执行所有javascript。这会将您的链接转换为标准链接，而无需任何JavaScript，因此不会执行帖子请求。

您可以使用jQuery而不是*选择器来解决这个问题，正如RyanBrodie建议的那样。

$('body *').not('.popover').click(function() {
  $('.popover').hide();
});

要确保popover中的元素不触发隐藏，请执行以下操作：

$('body *').not('.popover').not('.popover *').click(function() {
  $('.popover').hide();
});