原型-addEventListener单击-JavaScript

Question

对于下面编写的代码，我需要一些帮助，我需要在单击时返回该元素，但由于某种原因，它会发回Window对象而不是HTMLElement 。

的HTML

<div id="myDiv">Click me!</div>

的JavaScript

   function myP(selector) {
        if (!(this instanceof myP)) {
            return new myP(selector);
        }

        this.elem = document.querySelector(selector);
    }        

    myP.prototype = {
        click : function(objF){
            this.elem.addEventListener("click", function(){
                objF();
                console.log(this); //Returns the Element ( <div id="myDiv"> )
                return this; // Doesn't work
            }, false);
        }
    }

    myP("#myDiv").click(function(){
        console.log(this); // Returns [object Window]

        // I want to return: ( <div id="myDiv"> ) Element here

    });

谢谢

Answer 1

使用.call(EXPECTED_CONTEXT) this在被调用函数中传递EXPECTED_CONTEXT 。

尝试这个：

 function myP(selector) { if (!(this instanceof myP)) { return new myP(selector); } this.elem = document.querySelector(selector); } myP.prototype = { click: function(objF) { this.elem.addEventListener("click", function() { objF.call(this); return this; }, false); } } myP("#myDiv").click(function() { console.log(this); }); 

 <script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script> <div id="myDiv">Click me!</div>