我们如何使用JavaScript中的事件处理程序在public function内部调用public function

Question

<div id="a"></div><br>
<div id="b"></div>
<script>
    function Con(id){
        this.id = id;
        var me = this;

        x = function(){ // public function
            console.log(this.id)
        }.bind(this);

        this.y= function(){ // public function
            console.log(me)
            html = "<a href='javascript:void(0)' id='mycls-"+this.id+"' onclick='x()'>hello-"+this.id+"</a>";
            document.getElementById(this.id).innerHTML = html;
        }
        this.y();
    }
    var v = new Con("a");
    var v1 = new Con("b");
</script>

I have javascript constructor i want to call the x public function from a link which is inside of the y public function. I want to get the proper id EX: if I am click on the a div it should console a or if I am click on the b div it should console b but it always console only b.

Answer 1

Please pass the ID in the x function like a argument: onclick='x("+this.id+")'

x = function(arg){ // public function
    console.log(arg.id)
}.bind(this);

Please find the total code:

<div id="a"></div><br>
<div id="b"></div>
<script>
    function Con(id){
        this.id = id;
        var me = this;
        x = function(arg){ // public function
            console.log(arg.id)
        }.bind(this);

        this.y= function(){ // public function
            html = "<a href='javascript:void(0)' id='mycls-"+this.id+"' onclick='x("+this.id+")'>hello-"+this.id+"</a>";
            document.getElementById(this.id).innerHTML = html;
        }
        this.y();
    }
    var v = new Con("a");
    var v1 = new Con("b");
</script>