I have a stand-alone svg file that displays without problems. It includes some inline script, and references to 2 other scripts. The inline script calls an initialisation function in one of the other scripts, and this works on all the big browsers:
我有一个独立的svg文件，可以毫无问题地显示。它包括一些内联脚本，以及对另外两个脚本的引用。内联脚本在其他脚本中调用一个初始化函数，这适用于所有大型浏览器:
<svg ...>
<script type="application/ecmascript"><![CDATA[
...
do_init_in_foo1();
...
]]></script>
<script type="application/ecmascript" xlink:href="foo1.js"></script>
<script type="application/ecmascript" xlink:href="foo2.js"></script>
</svg>
Ok, here's the problem: when I instead load this script dynamically via Ajax, 'do_init_in_foo1' is no longer visible. It still works in Opera if the 'foo1.js' reference appears above the init call, and works in older versions of F/F, but otherwise doesn't work at all in the other browsers, irrespective of how I arrange the 3 script sections. The error message I get is ReferenceError: do_init_in_foo1 is not defined.
问题是:当我通过Ajax动态加载这个脚本时，“do_init_in_foo1”将不再可见。如果是“foo1”，它在Opera中仍然可以使用。js的引用出现在init调用的上面，并且在F/F的旧版本中工作，但是在其他浏览器中根本不能工作，不管我如何安排这3个脚本部分。我得到的错误消息是ReferenceError: do_init_in_foo1没有定义。
What is it about dynamic Ajax loading that changes the visibility? Is there some way around this?
什么是动态Ajax加载改变了可见性?有办法解决这个问题吗?
One option is to move this line:
一种选择是移动这条线:
<script type="application/ecmascript" xlink:href="foo1.js"></script>
into the parent document, since it doesn't change on different Ajax calls. However, if I do this, the browser complains about the moved script tag (Namespace prefix xlink for href on script is not defined). I think I would need to wrap the script tag in an svg tag to fix this, with an xmlns:xlink attribute, but this would then give me two top-level svgs, which would be (I think) a problem.
到父文档中，因为它在不同的Ajax调用中不会改变。但是，如果我这样做，浏览器会对移动的脚本标记(没有为脚本上的href定义名称空间前缀xlink)提出抱怨。我认为我需要用一个xmlns:xlink属性将脚本标记封装到一个svg标记中来修复这个问题，但这会给我带来两个*的svg，我认为这是一个问题。
Thanks.
谢谢。
2 个解决方案
#1
2
You can't rely on dynamically loaded javascript code, because you don't know whether it's loaded or not at the point you try to access it in your code. The best approach here is to call some function in your loaded script. For example, if you load foo1.js via AJAX call, you may add the following function at the end of this file:
您不能依赖于动态加载的javascript代码，因为您不知道在试图在代码中访问它时是否加载了它。这里最好的方法是在加载的脚本中调用某个函数。例如，如果加载foo1。通过AJAX调用js，可以在文件末尾添加以下函数:
function foo1Loaded(){
do_init_in_foo1();
//and here do whatever you need to do else with variables/functions from loaded file
}
foo1Loaded();
If you want to know when all the external scripts are loaded via AJAX calls, you may count them once they loaded (via callback functions, similar to described above).
如果您想知道所有的外部脚本何时通过AJAX调用加载，您可以在它们加载后(通过回调函数，类似于上面描述的)对它们进行计数。
#2
1
First, when you do anything asynchronously you have to consider that browser, computer, network and server speeds are all going to be an issue. You can't rely on dynamically loading code to be there. What if you end up having a network timeout? Dynamically loading code can work but you have to ensure the object is there before you call it. Checking to see if it's undefined and then throwing a setTimeout to retry it would work. jQuery on document ready is also very handy to make sure things are loaded.
首先，当您异步执行任何操作时，您必须考虑浏览器、计算机、网络和服务器速度都将成为一个问题。不能依赖于动态加载代码。如果网络超时怎么办?动态加载代码可以工作，但是必须在调用对象之前确保对象在那里。检查它是否为未定义的，然后抛出一个setTimeout重新尝试它。准备好文档的jQuery也非常方便，可以确保加载了内容。
Also remember that JS files are loaded in sequence in the browser. That is why it is very important to put unnecessary JS at the bottom of your document since you dont want to hold up CSS/HTML rendering while you're loading up something that may run well after the user views the page. i.e. tracking cookies, etc.
还要记住，在浏览器中按顺序加载JS文件。这就是为什么在文档底部放置不必要的JS是非常重要的，因为在加载用户查看页面后可能运行良好的内容时，您不希望暂停CSS/HTML呈现。即跟踪饼干等。
#1
2
You can't rely on dynamically loaded javascript code, because you don't know whether it's loaded or not at the point you try to access it in your code. The best approach here is to call some function in your loaded script. For example, if you load foo1.js via AJAX call, you may add the following function at the end of this file:
您不能依赖于动态加载的javascript代码，因为您不知道在试图在代码中访问它时是否加载了它。这里最好的方法是在加载的脚本中调用某个函数。例如，如果加载foo1。通过AJAX调用js，可以在文件末尾添加以下函数:
function foo1Loaded(){
do_init_in_foo1();
//and here do whatever you need to do else with variables/functions from loaded file
}
foo1Loaded();
If you want to know when all the external scripts are loaded via AJAX calls, you may count them once they loaded (via callback functions, similar to described above).
如果您想知道所有的外部脚本何时通过AJAX调用加载，您可以在它们加载后(通过回调函数，类似于上面描述的)对它们进行计数。
#2
1
First, when you do anything asynchronously you have to consider that browser, computer, network and server speeds are all going to be an issue. You can't rely on dynamically loading code to be there. What if you end up having a network timeout? Dynamically loading code can work but you have to ensure the object is there before you call it. Checking to see if it's undefined and then throwing a setTimeout to retry it would work. jQuery on document ready is also very handy to make sure things are loaded.
首先，当您异步执行任何操作时，您必须考虑浏览器、计算机、网络和服务器速度都将成为一个问题。不能依赖于动态加载代码。如果网络超时怎么办?动态加载代码可以工作，但是必须在调用对象之前确保对象在那里。检查它是否为未定义的，然后抛出一个setTimeout重新尝试它。准备好文档的jQuery也非常方便，可以确保加载了内容。
Also remember that JS files are loaded in sequence in the browser. That is why it is very important to put unnecessary JS at the bottom of your document since you dont want to hold up CSS/HTML rendering while you're loading up something that may run well after the user views the page. i.e. tracking cookies, etc.
还要记住，在浏览器中按顺序加载JS文件。这就是为什么在文档底部放置不必要的JS是非常重要的，因为在加载用户查看页面后可能运行良好的内容时，您不希望暂停CSS/HTML呈现。即跟踪饼干等。