Javascript原型函数和SVG setAttribute（onclick）_Javascript_Html_Svg_Onclick_Prototypejs

Javascript原型函数和SVG setAttribute（onclick）

javascript html svg

Javascript原型函数和SVG setAttribute（onclick）,javascript,html,svg,onclick,prototypejs,Javascript,Html,Svg,Onclick,Prototypejs,尝试使用svg onClick调用原型函数通常，要调用原型函数，我会这样做。（functionName），但当我将其放入.setAttribute（onclick，“this.（functionName）”）中时，它无法识别原型函数。有人有过这方面的经验吗如果上面不清楚，这里是它的基本jist function myobject(svgShape) { this.svgshape.setAttribute(onclick, 'this.doSomething()'); } myobj

尝试使用svg onClick调用原型函数

通常，要调用原型函数，我会这样做。（functionName），但当我将其放入

.setAttribute（onclick，“this.（functionName）”）

中时，它无法识别原型函数。有人有过这方面的经验吗

如果上面不清楚，这里是它的基本jist

function myobject(svgShape) {
    this.svgshape.setAttribute(onclick, 'this.doSomething()');
}
myobject.prototype.doSomething = function() {
    alert("works");
}

有三件事可能会有所帮助：

1）首先，我认为您缺少

myobject

函数顶部的这一行：

this.svgshape = svgshape;

我假设这只是发布问题时的一个错误，并将其插入下面

2）通常，在使用Prototype（或任何现代库）时，回调不使用字符串，而是使用函数。另外，您通常使用库的包装器为

addEventListener

attachEvent

（在Prototype的情况下）分配处理程序，而不是使用旧的DOM0属性。因此：

function myobject(svgShape) {
    this.svgshape = svgshape;
    $(this.svgshape).observe('click', this.doSomething); // STILL WRONG, see below
}
myobject.prototype.doSomething = function() {
    alert("works");
}

3）但是JavaScript没有方法（它并不真正需要它们），它只有函数，因此上面的内容无法确保

这个

（调用的上下文）设置正确。使用Prototype设置上下文：

function myobject(svgShape) {
    this.svgshape = svgshape;
    $(this.svgshape).observe('click', this.doSomething.bind(this));
}
myobject.prototype.doSomething = function() {
    alert("works");
}

（或者您可以使用自己的闭包来完成此操作。

bind

的优点是闭包位于一个控制良好的环境中，因此不会关闭您不想保留的东西。）

现在，我从未使用Prototype进行过任何SVG编程，因此如果

observe

由于某种原因无法工作，您可以尝试直接分配给

onclick

反射属性：

function myobject(svgShape) {
    this.svgshape = svgshape;
    this.svgshape.onclick = this.doSomething.bind(this);
}
myobject.prototype.doSomething = function() {
    alert("works");
}

我仍然在那里使用

bind

，以便

这个

具有正确的值

这些来自我贫血小博客的帖子提供了更多关于上述内容的讨论：

myobject

this.svgshape = svgshape;

addEventListener

attachEvent

function myobject(svgShape) {
    this.svgshape = svgshape;
    $(this.svgshape).observe('click', this.doSomething); // STILL WRONG, see below
}
myobject.prototype.doSomething = function() {
    alert("works");
}

这个

function myobject(svgShape) {
    this.svgshape = svgshape;
    $(this.svgshape).observe('click', this.doSomething.bind(this));
}
myobject.prototype.doSomething = function() {
    alert("works");
}

bind

observe

onclick

function myobject(svgShape) {
    this.svgshape = svgshape;
    this.svgshape.onclick = this.doSomething.bind(this);
}
myobject.prototype.doSomething = function() {
    alert("works");
}

bind

这个