Javascript 重新加载页面后使onclick事件保持不变_Javascript_Prototypejs

Javascript 重新加载页面后使onclick事件保持不变

javascript

Javascript 重新加载页面后使onclick事件保持不变,javascript,prototypejs,Javascript,Prototypejs,我使用Javascript打开另一个窗口并为所有链接注册一个点击处理程序： //Inside a class somewhere this.file_browser_window = $(window.open("/filebrowser", "file_browser_window", "width=800,height=600")) Event.observe(this.file_browser_window, 'load', function (){ //Thi

我使用Javascript打开另一个窗口并为所有链接注册一个点击处理程序：

//Inside a class somewhere
this.file_browser_window = $(window.open("/filebrowser", "file_browser_window",
        "width=800,height=600"))

Event.observe(this.file_browser_window, 'load', function (){
     //This is the event I am after
     Event.observe(this.file_browser_window, 'click', handle_click_in_browser);
}.bindAsEventListener(this));

// The Handler function
function handle_click_in_browser(evt){
   evt.stop();  

   url = evt.target.href;

   if(url && url.endsWith('.png')){
       console.log("Image clicked");
       //REMMEMBER THIS URL ON MAIN PAGE
       this.close();
   }
   else{
       console.log("Regular stuff clicked", this);
       this.location = url; //<-- THIS is the breaking point
   }
}

//在类的某个地方
this.file\u browser\u window=$（window.open（“/filebrowser”，“file\u browser\u window”，
“宽度=800，高度=600”））
Event.observe（this.file\u browser\u窗口'load'，函数（）{
//这就是我所追求的事件
观察事件（此.file\u浏览器\u窗口中的“单击”，在\u浏览器中处理\u单击）；
}.bindAsEventListener（本））；
//处理函数
在浏览器（evt）中单击函数句柄{
evt.stop（）；
url=evt.target.href；
if（url&&url.endsWith（'.png'））{
console.log（“点击图像”）；
//在主页上删除此URL
这个。关闭（）；
}
否则{
log（“正常的东西点击了”，这个）；
this.location=url；//您应该在弹出页面本身内为弹出页面应用单击事件处理程序。我看不出有任何理由让父窗口负责这些事件处理程序。
您可以通过将文件浏览器页面放在新弹出窗口中的iframe中来解决此问题。我可能是b确认编辑此代码，但现在这里有一些代码可能会帮助您开始（可能无法按原样工作--在没有测试的情况下执行此操作）
==从中启动弹出窗口的页面===========
// some code to launch the file browser wrapper popup
var file_browser_popup = $(window.open("/new_wrapper_page.html", "file_browser_popup",
                "width=800,height=600"));

<html>
<head>
<script type="text/javascript">
// most of your existing code stays the same, but things are moved around

function listenForClicks() {
    var ifrm = $('filebrowser_iframe');
    var content = (ifrm.contentWindow ? ifrm.contentWindow.document : (ifrm.contentDocument ? ifrm.contentDocument : null));
    if (content) {
        //This is the event I am after
        Event.observe(content, 'click', handle_click_in_browser);
    }

}

// The Handler function
function handle_click_in_browser(evt){
   evt.stop();  

   url = evt.target.href;

   if(url && url.endsWith('.png')){
       console.log("Image clicked");
       //REMEMBER THIS URL ON MAIN PAGE
       parent.close();
   }
   else{
       console.log("Regular stuff clicked", this);
       parent.location = url; //<-- THIS is the breaking point
   }
}
</script>
</head>
<body>
<iframe id="filebrowser_iframe" src="/filebrowser/" width="800" height="600" onload="listenForClicks();"/>
</body>
</html>

==内部new\u wrapper\u page.html
===========
// some code to launch the file browser wrapper popup
var file_browser_popup = $(window.open("/new_wrapper_page.html", "file_browser_popup",
                "width=800,height=600"));

<html>
<head>
<script type="text/javascript">
// most of your existing code stays the same, but things are moved around

function listenForClicks() {
    var ifrm = $('filebrowser_iframe');
    var content = (ifrm.contentWindow ? ifrm.contentWindow.document : (ifrm.contentDocument ? ifrm.contentDocument : null));
    if (content) {
        //This is the event I am after
        Event.observe(content, 'click', handle_click_in_browser);
    }

}

// The Handler function
function handle_click_in_browser(evt){
   evt.stop();  

   url = evt.target.href;

   if(url && url.endsWith('.png')){
       console.log("Image clicked");
       //REMEMBER THIS URL ON MAIN PAGE
       parent.close();
   }
   else{
       console.log("Regular stuff clicked", this);
       parent.location = url; //<-- THIS is the breaking point
   }
}
</script>
</head>
<body>
<iframe id="filebrowser_iframe" src="/filebrowser/" width="800" height="600" onload="listenForClicks();"/>
</body>
</html>


//大多数现有代码都保持不变，但有些东西会移动
函数listenforcicks（）{
var ifrm=$（'filebrowser_iframe'）；
var content=（ifrm.contentWindow？ifrm.contentWindow.document:（ifrm.contentDocument？ifrm.contentDocument:null））；
如果（内容）{
//这就是我所追求的事件
观察事件（内容“点击”，在浏览器中处理点击）；
}
}
//处理函数
在浏览器（evt）中单击函数句柄{
evt.stop（）；
url=evt.target.href；
if（url&&url.endsWith（'.png'））{
console.log（“点击图像”）；
//记住主页上的这个URL
parent.close（）；
}
否则{
log（“正常的东西点击了”，这个）；
parent.location=url；//弹出窗口中的链接是否指向同一域中的页面？因为我在弹出窗口中使用预先制作的文件浏览器。它自己完成所有工作，我只需要捕获结果。我用指向它的链接更新问题。因此，作为一种解决方法，您是否可以弹出一个带有事件绑定代码的自定义页面在自定义页面的iframe中不加载filebrowser部分？事件绑定代码可以查看iframe中的文档，并在每次iframe重新加载时附加侦听器。嗯..我可以这样做。如果您可以将其作为答案呈现，那就太好了。它是预先制作的，但是为什么您不能修改它以包含一个简单的javascript文件呢？以及你说它自己做所有的事情，这显然是不真实的，否则你就不必写这段代码了。当iframe中的内容发生变化时会发生什么？单击会被重新注册吗？还是我需要手动执行？当我单击浏览器中的链接时，我如何保持iframe在页面上？比如：iframe.contentWindow。location=url或iframe.content=load\u from\u url（url）.？？？好的。这样做：$（'filebrowser\u iframe'））.src=url；但是表单帖子呢？它们不再适用于此，我不能让它们正常通过，因为它们会删除我的iframe。该死，我只是想到了文件上传，它们不能用AjaxDjango处理。django有关于如何使用此控件的文档吗？