在用户点击时加载带有ajax的processing.js草图

我正在尝试在点击时加载带有ajax的processing.js草图，但它无效。 如果我立即加载草图，而不是用户交互，则它可以工作。 这是我的代码：

$('#clicker').click(function(){ var canvasRef = $(''); canvasRef.attr('data-src','/uploads/processing_js/anything_1.pde'); $('#loader').append(canvasRef); }); 

我还尝试了属性的’data-processing-sources’和’datasrc’。

任何人都知道为什么这不起作用？

Answer 1

我们只检查DOMContentLoaded上的data-processing-sources属性。 如果要在此之后加载Processing草图，可以使用Processing.loadSketchFromSources，这是Processing.js在内部用于加载草图的内容：

 $('#clicker').click(function(){ var canvasRef = document.createElement('canvas'); var p = Processing.loadSketchFromSources(canvasRef, ['/uploads/processing_js/anything_1.pde']); $('#loader').append(canvasRef); });