javascript - 从动态创建的函数调用时全局变量不可用

Question

全局变量 selected 的调用方式与 this.selected 类似，并且始终返回正确的值。

但是当从动态创建的函数调用时，它返回未知

onClick: function(val){
            for (i = 0; i < 
positions[this.selected].SHC.length; i++){
                var tag = 
positions[this.selected].SHC[i];
                var tagEl = 
document.createElement('p');

                console.log(this.selected) // RETURNS CORRECT VALUE
                tagEl.onclick = function(){
                    console.log(this.selected) // RETURNS UNKNOWN
                    for (j = 0; j < positions[this.selected].SHC.length; j++){

                        if (positions[this.selected].SHC[j] == this.innerHTML){
                            positions[this.selected].SHC.splice(j,1);
                        }
                    };
                ;}
                tagEl.textContent = tag;
                document.getElementById("uldshtags").appendChild(tagEl);
            }
        },

如何使全局变量也可用于动态创建的函数。

Answer 1

在“onclick”函数之前声明一个变量并分配“this”，并在“onclick”内使用该变量。

      onClick: function (val) {
    for (i = 0; i <
        positions[this.selected].SHC.length; i++) {
        var tag =
            positions[this.selected].SHC[i];
        var tagEl =
            document.createElement('p');
        var that = this;
        console.log(this.selected) // RETURNS CORRECT VALUE
        tagEl.onclick = function () {
            console.log(that.selected) // RETURNS UNKNOWN
            for (j = 0; j < positions[that.selected].SHC.length; j++) {

                if (positions[that.selected].SHC[j] == this.innerHTML) {
                    positions[that.selected].SHC.splice(j, 1);
                }
            };

        }
        tagEl.textContent = tag;
        document.getElementById("uldshtags").appendChild(tagEl);
    }
}