问题描述
我创建了一些自定义弹出窗口"(最初使用"display:none;"设置样式),这些弹出窗口通过相邻的".popup_trigger"链接进行了切换,并具有以下摘要功能:
I've created some custom "popups" (initially styled with "display:none;") that are toggled via an adjacent ".popup_trigger" link with the following summarized functionality:
# /public/javascripts/application.js
jQuery(document).ready(function(){
// Trigger a popup
jQuery('.popup_trigger').live('click', function(event) {
jQuery(this).next('.popup').toggle(0, function() {
// Prevent the jQuery('body').click() below if the click occurs inside the popup
jQuery(this).click(function(event){
event.stopPropagation();
});
});
return false;
});
// "Outside" click hides popup
jQuery('body').click(function() {
jQuery('.popup:visible').toggle();
});
});
这样可以很好地显示弹出窗口,然后在发生外部"单击时将其隐藏.但是,在一个这样的弹出窗口中,我有以下内容:
This works fine for displaying the popups and then hiding them when an "outside" click occurs. However, inside one such popup I have the following:
<%= link_to 'Delete medical record', medical_record, :confirm => 'Permanently delete this medical record?', :method => :delete, :remote => true %>
呈现以下内容:
<a href="/medical_records/1" data-confirm="Permanently delete this medical record?" data-method="delete" data-remote="true" rel="nofollow">Delete medical record</a>
我的问题是,当我触发显示弹出窗口时,event.stopPropagation();
调用似乎禁用了此链接的远程功能.也就是说,当我单击链接时,它会发送一个普通的旧的(不是远程的)"/medical_records/1"的GET请求,该请求查找show动作而不是destroy.
My problem is that when I trigger the popup to display, the event.stopPropagation();
call appears to disable the remote functionality of this link. That is, when I click the link, it sends a plain old (not remote) GET request of '/medical_records/1' which looks for the show action instead of destroy.
如果我在上面的JS中注释掉event.stopPropagation();
,则远程链接可以正常工作,但是当我在内部单击时,弹出窗口会隐藏.
If I comment out the event.stopPropagation();
in my JS above, the remote link works fine, but then the popup hides when I click inside.
我应该怎么做才能使活动弹出窗口仅在其自身外部单击时才隐藏,并且还允许远程链接起作用?
What can I do to have it so an active popup hides only when clicked outside of itself, and also allow the remote links to work?
谢谢.
推荐答案
存在完全相同的问题:现在我使用此插件,效果很好:
Had exactly the same problem: Now I use this plugin, works great:
http://plugins.jquery.com/project/ba- jquery-outside-events-plugin
这篇关于jQuery的event.stopPropagation()导致Rails问题:remote =>真的的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!