Question

我想从我的页面中的HTML按钮调用paper.js函数，但我相信paper.js函数存在于它们自己的范围内。 paper.js文档提到互操作性，这听起来像是正确的，然后带我到一个“即将推出”的页面：

http://paperjs.org/tutorials/getting-started/paperscript-interoperability/

有谁知道如何从我的HTML页面调用在paper.js脚本中创建的函数？

Answer 1

为那个缺少的教程道歉。我最后会花一些时间来写它。

我去年在邮件列表上回答了这个问题：https://groups.google.com/d/msg/paperjs/C6F0XFlplqM/_67AMqCR_nAJ

Scoped PaperScript在全局范围内运行，并且可以访问全局范围的所有元素。在全局范围（= window）中运行的普通JavaScripts将不会看到这些PaperScope，也无法访问它们的变量。

在两者之间交换信息有一个简单的解决方案：只需声明一个用于来回交换的全局结构，例如

window.globals = {
    someValue: 10,
    someFunction: function() { alert(globals.someValue); }
};

在PaperScript中，您可以通过“全局”访问它，因为它位于窗口范围内：

globals.someValue = 20;
globals.someFunction();

同样，您可以使用普通JavaScript中的此结构。

Answer 2

我只想为遇到这种情况的任何人添加一些说明。

对于PaperScript到JavaScript的互操作性，请执行以下操作...

在HTML文件中：

<button type="button" id="btn">Click Me!</button>

在JavaScript文件中：

$(document).ready(init);

function init(jQuery) {
  $("#btn").click(window.globals.paperClicked);
}

// PaperScript Interop
window.globals = {
  paperClicked: function() {}
}

在PaperScript文件中：

// JavaScript Interop
globals.paperClicked = internalClicked;

function internalClicked() {
  alert('clicked!');
}

Paper.js互操作性

2 个答案: