Javascript JQuery打开弹出窗口并从单击的链接返回值

我想用JQuery打开一个弹出窗口来显示选定的图像。图像被包装在无序列表中的链接标记中。在某个时候会添加一些导航，所以我认为对话框不合适。以下是我目前掌握的代码：

主页：

<script>
    $('.ImageManager').click(function (event) {
        event.preventDefault();
        window.open($(this).attr("href"), "popupWindow", "width=600, height=400, scrollbars=yes");
    });
</script>


<a href="/image-manager" class="ImageManager">Add Image</a><br />
<ul id="imagelist">
</ul>

$（'.ImageManager'）。单击（函数（事件）{
event.preventDefault（）；
window.open（$（this.attr（“href”），“popupWindow”，“宽度=600，高度=400，滚动条=yes”）；
});

弹出窗口：

<script>
    $(function() {
        $(".addimage").click(function() {
            $("#imagelist", opener.document).append("<li></li>");
            return false;
        });
    });
</script>


<ul>
% for image in images:
<li><a href="" class="addimage"><img src="/static/images/{{ image }}" alt="" /></a></li>
% end
</ul>

$（函数（）{
$（“.addimage”）。单击（函数（）{
$（“#imagelist”，opener.document）。追加（“
”）；
返回false；
});
});

%对于图像中的图像：

%结束

我遇到的第一个问题是弹出窗口没有打开，它只是在当前浏览器窗口中打开图像管理器。我在这两页的标题部分都引用了JQuery，它可以与其他JQuery代码一起使用

其次，我尝试使用普通Javascript打开弹出窗口，但我无法获得单击的图像链接，将图像文件名附加到打开器窗口，弹出窗口随后也不会关闭

---

如果我能让弹出窗口正常工作，我如何传递在单击弹出窗口中的图像时传递的{image}变量（Python瓶子模板变量）？

好的，让我来尝试一下：短而甜，你需要引用打开的窗口

当然，在JSFIDLE中，我受到了限制，因为我不能像您那样创建多个要加载的文档，所以这看起来与您的有点不同；很抱歉但是我可以通过修改隐藏div中的HTML来创建相同的效果。隐藏div是您的“其他文档”

使用window.open创建新窗口时，返回的是对该窗口的引用，这就是我的代码中的w和$w。这或多或少是javascript中的“窗口”。所以，当你看到

$('#imagelist', w.opener.document)

w=窗口。尽管如此，如果需要，这确实显示了一种映射功能的替代方法，即调用子文档并从父文档绑定

代码：

$（'.ImageManager'）。单击（函数（事件）{
event.preventDefault（）；
var w=window.open（“，”弹出窗口“，”宽度=600，高度=400，滚动条=yes”）；
var$w=$（w.document.body）；
$w.html（$（'#modalText'）.html（））；
$w.find（“.addimage”）。单击（函数（e）{
e、 预防默认值（）；
控制台日志（w.opener.document）；
$（“#图像列表”，w.opener.document）。追加（“
”）；
});
});

---

字符串（提琴）：

现在奇怪的是，我已经把你的JSFIDLE一个字母一个字母地复制到另一个提琴中，并且两个都可以，但是如果我尝试将它合并到一个静态页面或瓶子模板中，我仍然无法得到弹出窗口。将更新我的帖子，看看是否有人能看到我代码中的错误。哎哟。。。。我一编辑我的帖子就看到了。不知怎么弄丢了我的文件准备行。抱歉，再次编辑，已解决。在我睡觉之前我不会再碰键盘了。谢谢戴维，哈哈。我去过那里。如果在某个地方用逗号表示，那就更好了，因为它不应该出现在直播前10分钟。很乐意帮忙。

$('.ImageManager').click(function (event) {
    event.preventDefault();
    var w = window.open("", "popupWindow", "width=600, height=400, scrollbars=yes");
    var $w = $(w.document.body);
    $w.html($('#modalText').html());
    $w.find(".addimage").click(function(e) {
        e.preventDefault();
        console.log(w.opener.document);
        $("#imagelist", w.opener.document).append("<li></li>");
    });
});