0

我在多个页面上使用 processing.js 时遇到问题。

我有一个母版页（test.html），它通过 jquery 将所有页面加载到一个名为“contentarea”的 div 中。这只是“test.html”的摘录，只是为了让你明白：

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>  
<script src="js/processing.js"></script>
<script> 
$(document).ready(function(){$("#contentarea").load("page1.html");
etc...
</script>
<div id="contentarea">...</div>

如您所见，Test.html 包含处理引用“src="js/processing.js"”，并将拦截其自己页面上的任何静态“canvas data-processing-sources”（“test.html” - only）。

当 page1.html 加载到 test.html 中时，processing.js 不会初始化画布。但是当单独查看页面（page1.html）时，processing.js 会拦截“canvas data-processing-sources”并正常加载。

这是该问题的一个工作示例：

例子

http://78revelationscom.ipage.com/site/test/test.html

问题：

如何让 processing.js 初始化（或重新初始化、刷新或加载）动态加载的画布？

先感谢您！

4

1 回答 1

0

这可能仍然是一个问题，因为直到下一个版本才能在库中解决它：目前，解决方案是不依赖处理自动加载，因为这只发生在 DOMContentLoaded 事件上。相反，当您更改页面内容时，您可以获取画布的 data-processing-sources 属性并从指定的源代码创建一个新的处理实例：

function loadSketchOnContentSwap() {
    var canvas = /* get the relevant canvas however you want */
    var sources = canvas.getAttribute("data-processing-sources").split(/\s+/);
    Processing.loadSketchFromSources(canvas, sources);
}
于 2012-07-07T15:24:18.213 回答