javascript - JavaScript 对象字面量中定义的事件处理程序可以访问自身吗?

标签 javascript event-handling dom-events

如果对象是一个函数,我知道我可以用闭包 (var self = this) 来做到这一点:

<a href="#" id="x">click here</a>

<script type="text/javascript">
    var object = {
        y : 1,

        handle_click : function (e) {
            alert('handling click');
    
            //want to access y here
    
            return false;
        },

        load : function () {
            document.getElementById('x').onclick = this.handle_click;
        }
    };

    object.load();
</script>

最佳答案

将对 handle_click 的调用绑定(bind)到定义它的对象的最简单方法如下:

        var self=this;
        document.getElementById('x').onclick = 
           function(e) { return self.handle_click(e) };

如果您需要传递参数或想让代码看起来更简洁(例如,如果您设置了很多类似的事件处理程序),您可以使用柯里化(Currying)技术来实现相同的目的:

bind : function(fn)
{
   var self = this;
   // copy arguments into local array
   var args = Array.prototype.slice.call(arguments, 0); 
   // returned function replaces first argument with event arg,
   // calls fn with composite arguments
   return function(e) { args[0] = e; return fn.apply(self, args); };
},

...

        document.getElementById('x').onclick = this.bind(this.handle_click, 
           "this parameter is passed to handle_click()",
           "as is this one");

关于javascript - JavaScript 对象字面量中定义的事件处理程序可以访问自身吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/306136/

相关文章:

javascript - 有谁知道为什么当我将它部署到 heroku 时,我的 bootstrap 主题投资组合的样式搞砸了?

javascript - Ext.net (ASP.NET) 中的上传完成事件?

events - 在 DownloadProgressChanged 事件期间从 DownloadFileAsync 对事件处理程序的更新缓慢

javascript - jQuery 向事件发送参数

javascript - 如何将事件传递到去抖函数中?

javascript - window.onpopstate, event.state == null?

JavaScript 自定义事件

javascript - 如何从提取和 promise 中获取HTTP错误详细信息和文本?

javascript - 如何使用同一子域上的 URL 访问 iframe 的元素?

javascript - 无法更新具有相同 id 的多个 div