安全地运行javascripts onload

-2

我有两个javascripts我想同时运行，以创建一个分层的动画。两者基本上是相同的脚本，但具有不同的设置安全地运行javascripts onload

我使用<body onload="animate(); ch();">加载每个函数。

分开，两个循环都正常工作。当我尝试同时运行两个文件时，以文档中第一个为准运行正常，但第二个不会运行。

我是jsfiddle的新手，但jsfiddle关于document.write的使用，我不知道如何在jsfiddle中包含多个javascript。

这两个脚本都是循环，并应无限循环。分开，这里是每一个应该是什么样子： http://nanocluster.umeche.maine.edu/scope/

UPDATE：HTML来源：

http://nanocluster.umeche.maine.edu/scope/saw.html

有人能指出我怎么能有两个脚本在同一时间循环？

<!DOCTYPE html><html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<link rel="shortcut icon" href="http://www.hackmaine.org/favicon.ico"> 
<link rel="stylesheet" type="text/css" href="main.css"> 
<title>Epic Lulz</title> 
<style> p.ex {color:rgb(0,0,0);}</style> 
</head> 
<body onload="animate(); ch();"> 
    <script type="text/javascript" src="animate.js"></script> 
    <script type="text/javascript" src="ch.js"></script> 
<div id="background"> 
<pre> 
+---------+---------+---------+---------+---------+---------+---------+---------+---------+---------+ 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
+---------+---------+---------+---------+---------+---------+---------+---------+---------+---------+ 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
+---------+---------+---------+---------+---------+---------+---------+---------+---------+---------+ 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
+---------+---------+---------+---------+---------+---------+---------+---------+---------+---------+ 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
|   |   |   |   |   |   |   |   |   |   | 
+---------+---------+---------+---------+---------+---------+---------+---------+---------+---------+ 
_____________________________________________________________________________________________________ 
t1:288 ms t2:480 ms Display Mode: Normal: Peak Detect Vectors: OFF  Grid = FULL 
</pre> 
</div> 
<div class="container" style=" visibility: hidden; color: rgb(254, 0, 0);" id="cat1"> 
<pre> 

    ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ 
    │  │ │  │ │  │ │  │ │  │ │  │ │  │ 
──┘  └────┘  └────┘  └────┘  └────┘  └────┘  └────┘ 


</pre></div> 
<div class="container" style=" visibility: hidden; color: rgb(254, 0, 0);" id="cat2"> 
<pre> 

┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ 
│  │ │  │ │  │ │  │ │  │ │  │ │  │ 
     └────┘  └────┘  └────┘  └────┘  └────┘  └────┘  └── 


</pre></div> 
<div class="container" style="visibility: hidden; color: rgb(254, 0, 0);" id="cat3"> 
<pre> 

    ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ 
    │  │ │  │ │  │ │  │ │  │ │  │ │  │ 
──┘  └────┘  └────┘  └────┘  └────┘  └────┘  └────┘ 


</pre></div> 
<div class="container" style="visibility: hidden; color: rgb(254, 0, 0);" id="cat4"> 
<pre> 

┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ 
│  │ │  │ │  │ │  │ │  │ │  │ │  │ 
     └────┘  └────┘  └────┘  └────┘  └────┘  └────┘  └── 


</pre></div> 
<div class="container" style=" visibility: hidden; color: rgb(254, 0, 0);" id="cat5"> 
<pre> 

    ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ 
    │  │ │  │ │  │ │  │ │  │ │  │ │  │ 
──┘  └────┘  └────┘  └────┘  └────┘  └────┘  └────┘ 


</pre></div> 



    <div class="test" style="visibility: hidden; color: rgb(0, 0, 254);" id="cat1"> 
    <pre> 





&Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda;            
\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/             
    V V V V V V V V V V V V V V V V V V V V  

</pre></div> 


    <div class="test" style="visibility: hidden; color: rgb(0, 0, 254);" id="cat2"> 
    <pre> 





    &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda;            
/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\              
V V V V V V V V V V V V V V V V V V V V \ 

</pre></div> 

    <div class="test" style="visibility: hidden; color: rgb(0, 0, 254);" id="cat3"> 
<pre> 





    &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda;            
\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\              
V V V V V V V V V V V V V V V V V V V V  

</pre></div> 

    <div class="test" style="visibility: hidden; color: rgb(0, 0, 254);" id="cat4"> 
    <pre> 





&Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda;            
\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/             
    V V V V V V V V V V V V V V V V V V V V  

</pre></div> 

    <div class="test" style="visibility: hidden; color: rgb(0, 0, 254);" id="cat5"> 
    <pre> 





    &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda; &Lambda;            
/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\/\              
V V V V V V V V V V V V V V V V V V V V \ 

</pre></div> 

</body></html>

来源

2014-07-24 j0h

你能证明你是如何“在同一时间运行”与你在问题中提供了什么？ –

一个接一个地循环，足以给人一种印象，但你可以尝试setTimeOut来做异步调用 – juvian

如果我可以在同一时间运行两个我不会有这个问题。但我会发布代码。 – j0h

我假定您在浏览器中运行这些代码，并在第3段中声明：“......以文档中第一个为准......”。

如果这种假设是正确的，就没有办法让它们在浏览器中并行运行。

来源

2014-07-24 22:25:26 ussabin

IDK男人我想我可以做到。 – j0h

我想我可以和网络工作者一起做。虽然我刚开始阅读有关它们，但我确实有多个并发运行的示例脚本.http：//www.html5rocks.com/en/tutorials/workers/basics/ – j0h

似乎没有WebWorkers允许您在DOM上运行。您可以运行执行计算和其他有用工作的后台进程;但是，我不认为DOM可以被并发线程操作。 – ussabin

安全地运行javascripts onload

回答

相关问题