跨HTML窗口的Javascript函数调用 [英] Javascript function call across HTML windows

查看:133
本文介绍了跨HTML窗口的Javascript函数调用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

根据页面I应该可以调用子窗口的参数和函数,但它不适用于我。

  var w = window.open ( index.html的); 
console.log(w);
console.log(w.foo);

console.log(w)显示有一个名为 foo 但是 console.log(w.foo) outputs 的函数undefined 。这是一个安全问题吗?






编辑以下是一些功能:


$ b

child.html(省略正文):

 < head> 
< script type =text / javascript>
test = 123;
函数foo(arg){
//做某事
}
< / script>
< / head>

parent.html:

  var w = window.open(child.html); 
console.log(w);
//输出所有的方法和参数
console.log(w.foo);
//输出'undefined'
console.log(w.test);
// outputs'undefined'






编辑2 另外,我应该解释为什么我需要传递参数,因为有人会不可避免地问我为什么我不能'硬编码'。我有一个HTML canvas元素,每次用户右键单击时,都会有一个右键单击菜单,其中包含下方的列表形状选项。



当用户单击菜单项,我想传递该点击下所有形状的列表并将其显示在新窗口中。以下是我遇到的问题:


  1. 我无法将其作为参数传递b / c我不知道无论窗口是否已经加载(我似乎无法改变 onload 函数)


  2. 我不能让子窗口查询父窗口b / c点击后右键菜单消失。



解决方案

问题在于,在尝试检查其内容之前,您没有给予子窗口的DOM机会。



console.log(w)通过立即显示 Window 或类似的方式显示工作,但实际上它只是通过当你的人的手指在控制台中扩展项目细节时,属性和方法存在。



当我注入延迟在Firebug断点的帮助下,我可以看到子窗口的属性就好。



这个问题讨论了为儿童添加onLoad事件监听器。使用其接受的答案,如何:

 < script type =text / javascript> 
// parent.html
var w;

函数lol(){
console.log(w.foo);
console.log(w.test);
}

w = window.open(child.html);
console.log(w);
w.addEventListener('load',lol,true);
< / script>

(我也能用1s setTimeout 延迟。)


According to this page I should be able to call parameters and functions of child windows, but it is not working for me.

var w = window.open("index.html");
console.log(w);
console.log(w.foo);

console.log(w) shows that there is a function named foo but console.log(w.foo) outputs undefined. Is this a security issue?


EDIT Here is some more functionality:

child.html (omitting the body):

<head>
 <script type="text/javascript"> 
  test = 123 ;
  function foo(arg){
   //do something
  }
 </script>
</head>

parent.html:

var w = window.open("child.html");
console.log(w);
//outputs all the methods and parameters
console.log(w.foo);
//outputs 'undefined'
console.log(w.test);
//outputs 'undefined'


EDIT 2 Also I should explain why I need to pass arguments as someone will inevitably ask me why I can't 'just hard code it'. I have an HTML canvas element, and every time the user right clicks, there is a right click menu with the option 'list shapes underneath'.

When the user clicks this menu item, I want to pass a list of all the shapes underneath that click and to display it in a new window. Here are the problems I am facing:

  1. I can't pass it as an argument b/c I don't know whether the window has been loaded (I can't seem to change the onload function either)

  2. I can't have the child window query the parent window b/c the right click menu disappears after clicking it.

解决方案

The problem is that you are not giving the DOM of the child window a chance to load before trying to inspect its contents.

console.log(w) appeared to work by displaying Window or similar immediately, but in fact it's just that by the time your human fingers got around to expanding the item details in the console, the properties and methods were present.

When I inject a delay with help from a Firebug breakpoint, I can see the child window's properties like this just fine.

This question talks about adding onLoad event listeners for children. Using its accepted answer, how about:

<script type="text/javascript">
// parent.html
var w;

function lol() {
    console.log(w.foo);
    console.log(w.test);
}

w = window.open("child.html");
console.log(w);
w.addEventListener('load', lol, true);
</script>

(I was also able to achieve success with a 1s setTimeout delay.)

这篇关于跨HTML窗口的Javascript函数调用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆