在javascript中将对象作为函数调用答案

【问题标题】：Call an object as a function in javascript在javascript中将对象作为函数调用
【发布时间】：2012-05-03 16:05:19
【问题描述】：

我正在尝试使用 javascript 代码在网页上执行事件（例如 onClick 事件）时调用的 javascript 函数。我从这样的事件中获取函数：

var attributval = document.getElementsByTagName("a").getAttribute('onClick');

我正在尝试将这个对象（实际上是一个 javascript 函数）作为一个函数执行（假设我们有这个例子，我试过了：

var attributval = document.getElementsByTagName("a").getAttribute('onClick');
attributval() = function(){attributval};
attributval();

但是没有用。

【问题讨论】：

那么你只是在做点击会做的事情吗？您正在尝试像单击按钮一样运行函数attributval？
是的，我也想对其他事件（例如 onBlur）进行此操作。

标签： javascript javascript-events onclick

【解决方案1】：

DOM 属性与 JavaScript 属性不同（即使它们可以具有相同的名称 onclick）。你应该使用

var attributval = document.getElementsByTagName("a")[0].onclick;

从 JS 对象中检索函数（或 null）（而不是 getAttribute()，它很可能会为属性返回 toString()）。

现在，attributval() = 是非法语法，因为 attributval() 不是左值（您不能将 分配给它）。

attributval(); 可以工作，但如果没有第二行（这是非法的 JavaScript），它将调用原始 A 元素 onclick 处理程序（如果已定义）或抛出异常（如果 onclick 处理程序是 @987654331 @)。

【讨论】：

我一直在寻找它的工作，但我可以将此解决方案扩展到其他事件，如 onBlur 或 onScroll 而不是 onClick 吗？非常感谢
当然，这适用于任何类似的 on_event_ 属性。

【解决方案2】：

跳过尝试围绕函数创建函数。就叫它吧：

var attributval = document.getElementsByTagName("a")[0].onclick;
attributval();

【讨论】：

【解决方案3】：

试试

var attributval = document.getElementsByTagName("a")[0].getAttribute('onClick');

【讨论】：

【解决方案4】：

通过使用 get 属性，您将返回一个字符串，因此您唯一的方法是使用 eval(onclickString) 或 var fn = new Function(onClickString); fn();

【讨论】：

不确定是否应该提倡使用eval——几乎总有更好的方法。
如果您正在收集字符串，除了 eval 和 new Function() 之外，不幸的是，没有更好的方法。但是，是的，这里存在安全问题。但是，访问 onclick 事件处理程序也会产生问题，如果附加到它的其他处理程序并触发它会触发每个事件处理程序附加到它。我敢肯定，在他的情况下，这可能不是问题，最好的方法是无论如何都不使用 onclick 属性:) 从不理解访问事件属性的必要性。

【解决方案5】：

attributval 只是一个字符串，对吗？如果您信任此代码，请使用eval(attributval) 执行它——但是任何对this 的引用都不起作用。

您可能想要的是manually trigger an event。 jQuery makes that easy.

【讨论】：

【解决方案6】：

如果您想做的不仅仅是点击，那么 Chris McDonald 在Is it possible to trigger a link's (or any element's) click event through JavaScript? 的回答似乎符合要求，尽管您可能需要注意第三条评论。

【讨论】：

【解决方案7】：

我想我会添加一个关于如何使用 jQuery 处理事件的简短答案，因为它看起来很相关。

// Select the link using it's ID field (assuming it has one)
var myLink = $('a#myLink')

// Add a click event to the link
myLink.on('click', function(e) {
    console.log("I've been clicked!");
});

// Trigger the click event manually. This would result in the above
// function being run. Interestingly, this will not cause the browser
// to follow the link like a real click would
myLink.trigger('click');

// Remove the click event (this removes ALL click events)
myLink.off('click');

// Add a click event to the link that only runs once, then removes itself
myLink.one('click', function() {
    alert("I'll only bother you once!");
});

// Add a click event that you can identify from other click events.
// This means that you can trigger it or remove it without bothering other
// click events
myLink.on('click.myClick', function() {
    alert("This click event has been identified as 'myClick'");
});

// Now you can trigger it without triggering other click events
myLink.trigger('click.myClick');

// And remove it, also with no harm coming to other click events
myLink.off('click.myClick');

希望对你有帮助

【讨论】：