javascript - jquery事件绑定中的this指向问题

Question

代码如下：

---

$(function(){
                $.ajax({
                    type:"GET",
                    url:"/msg",
                    success:function(data){
                        var html="";
                        for(var o of data){
                            html+=`
                                <tr>
                                    <td>${o.mid}</td>
                                    <td>${o.uname}</td>
                                    <td>${o.content}</td>
                                    <td>${o.pubtime}</td>
                                    <td>
                                        <a class="btn-del" href="${o.mid}">删除</a>
                                    </th>
                                </tr>
                            `;
                        }
                        $("#tb1").html(html);
                    }
                });

                $("#tb1").on("click","a.btn-del",(e)=>{
                    e.preventDefault();
                    //var mid=this.getAttribute("href");
                    console.log(this);
                });
            });

我需要给异步请求生成的a.btn-del绑定删除事件，需要获取当前点击元素的herf属性值；通过e.target可以或得；但是通过this,不可以。console.log(this)后 ，输出#document.

难道事件代理中this不是指向当前点击的元素吗？？

Answer 1

你把 (e)=> {} 改成 function(e){} 看看。

你应该先去了解下this的绑定机制。

箭头函数中this是指向外层函数作用域。

Answer 2

下面是js函数调用的几种方式：

var func = function(a,b){
    console.log(this); 
    console.log(a + ' ' + b)
};

var self = 'test';
func(1,2);   // this 是 window 对象, 因为此时调用函数的是window对象
func.call(self,1,2);  // this是 字符串  'test'
func.apply(self,[1,2]); // this是 字符串  'test'

js不是面向对象的语言,跟java比, 在实现面向对象上,语法上面是会有些奇怪。
如果是以 func() 的方式调用函数, 则this的值取决于调用函数的是在哪个对象。
在设置回调函数时，如果没有传this参数， 就是 func()的调用方式，一般的写法应该是用另外一个变量来保存this的值, 通常变量名为self。

var self = this;
XXXX.callback = function(){
    console.log(self);
};

Answer 3

如果要调用jq的方法，应该使用$(this)才代表的是jq对象

Answer 4

雷雷