javascript 单击 rails 中的 URL 时如何弹出面板？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7266822/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to popup a panel when clicking a URL in rails?
提问by SL_User
I'm new to rails and I need to know how to pop-up a panel by clicking a URL ?? Please can some one give me solution for this problem.
我是 Rails 的新手，我需要知道如何通过单击 URL 来弹出面板？请有人给我解决这个问题的方法。
回答by Matt
Take a look at Shadowbox, Colorboxor Lightbox.
看看Shadowbox、Colorbox或Lightbox。
Code example using Shadowbox:
使用Shadowbox 的代码示例：
in your head tag:
在你的头部标签中：
<%= stylesheet_link_tag "shadowbox" %>
in the application layout (before closing your body tag):
在应用程序布局中（在关闭 body 标签之前）：
<%= javascript_include_tag "shadowbox.js" %>
<script type="text/javascript">
Shadowbox.init({
handleOversize: "drag",
overlayColor: '#fff'
});
</script>
And in your views:
在你看来：
link_to(event.name, event_path(event), :rel => 'shadowbox;width=500;height=300;')
Note that you might need to change some of the code above, depending on where you extracted the Shadowbox source files. Hope that helps.
请注意，您可能需要更改上面的某些代码，具体取决于您提取 Shadowbox 源文件的位置。希望有帮助。
回答by chourobin
You could look at modal dialogs by www.jqueryui.com. Add jquery ui to your application.
您可以通过 www.jqueryui.com 查看模态对话框。将 jquery ui 添加到您的应用程序。
Put a hidden div (display:none) in your layout page.
在布局页面中放置一个隐藏的 div (display:none)。
<div class="modal" style="display:none;">
</div>
Your link should be an ajax link:
你的链接应该是一个ajax链接：
<%= link_to 'Link', events_path(@event), :remote => true %>
Your controller should accept ajax response:
您的控制器应该接受 ajax 响应：
def show
@event = Event.find(params[:id])
respond_to do |format|
format.js
end
end
This is where the magic happens. After pressing the link via ajax, your show.js file will insert content into your empty hidden div and display the popup. Your views should have a javascript file: /view/events/show.js.erb
这就是魔法发生的地方。通过 ajax 按下链接后，您的 show.js 文件会将内容插入到您的空隐藏 div 中并显示弹出窗口。你的视图应该有一个 javascript 文件：/view/events/show.js.erb
$('.modal').html("<%= escape_javascript(render(@event)) %>"); //inserts content into your empty div, be aware that the parameter needed to be quoted.
$('.modal').dialog(); //jquery ui will open it as a modal popup
In the example above it will render an event partial. So you should make it by creating an _event.html.erb file in /views/events/
在上面的例子中，它将呈现一个事件部分。所以你应该通过在 /views/events/ 中创建一个 _event.html.erb 文件来实现它
回答by Mateusz Chromiński
Opening new window isn't actually rails responsibility. You should do it by using javascript snippet. Consider this:
打开新窗口实际上不是导轨责任。您应该使用 javascript 代码段来做到这一点。考虑一下：
<script type="text/javascript">
window.open('desired/URL', 'windowName', 'height=200,width=200');
</script>
you should suit the third argument to your needs. Look at: http://www.javascript-coder.com/window-popup/javascript-window-open.phtml
你应该根据你的需要适应第三个论点。看看：http: //www.javascript-coder.com/window-popup/javascript-window-open.phtml
Notice, that there is no problem with using rails snippets in js (<%= %>), so you can make link flexible by using some helper method.
请注意，在 js (<%= %>) 中使用 rails 片段没有问题，因此您可以通过使用一些辅助方法使链接灵活。
