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

雷雷