我正在尝试学习一些javascript并且卡住了。
现在,我有一个非常愚蠢的简单图库/图像应用程序。我想要做的就是这样做,当有人点击图片时,它会将它们超链接到我在模型数据中使用ajax的网址。我之所以也想用ajax做些什么,比如在点击图像时更新图像的得分/投票计数器。
现在在视图中我这样做:
<% @galleries.each do |g| %>
<% for image in g.images %>
<div id="picture">
<%= render 'top_nav'%>
<%= link_to image_tag(image.file_url(:preview)), g.source, :remote => true, :target => "_blank" %>
到目前为止,使用javascript我已经弄清楚如何打开一个网址,但前提是我将一个硬编码到javascript中。这是我的index.js.erb代码(非常简单):
window.open("http://www.google.com");
但我无法弄清楚我将如何链接到我的g.source,就像我在我的视图中的循环一样。如何在javascript中访问此模型数据?我已经想出了如何在点击图像时渲染这段代码,但是后面有... javascripts / application.js:
$(function() {
$("#galleries #picture a img").live("click", function() {
$.getScript(this.href);
return false;
});
});
任何人都有关于如何开始与我的应用程序数据进行交互而不是在开放时对网址进行硬编码的任何指示?
由于
答案 0 :(得分:2)
如果您从href
获得的a
指向图片文件,那么您在窗口中打开图片几乎是正确的道路。
尝试使用此代码:
$(function() {
$("#galleries #picture a img").live("click", function() {
var lnk = $(this).closest("a").attr("href");
window.open(lnk);
return false;
});
});
"#galleries #picture a img"
正在为您提供img
元素,但您需要包含图片的hyperlink
。因此,我们将使用$(this).closest("a")
获取hyperlink
图片网址。