作者NCKUFatPork (成大肥宅悲歌)
看板Ajax
标题[问题] jquery中，e.target跟this的差别?
时间Fri Jan 19 16:31:19 2018
小弟最近在练习jquery的fadeOut和remove
现在我在html档中有一个ul:
<li class="todoItem"><span class="delete"> x </span>bla</li>
我希望的功能是点了x之後list item会消失
所以我写的jquery如下:
$(".delete").click(e =>
$(e.target)
.parent().fadeOut(150, e => $(e.target).remove())
)
执行後有达到我预期的效果，
但看console会得到以下讯息:
TodoList.js:9 Uncaught TypeError: Cannot read property 'target' of undefined
at HTMLLIElement.$.parent.fadeOut.e (TodoList.js:9)
at HTMLLIElement.opt.complete (jquery-3.2.1.js:7236)
at fire (jquery-3.2.1.js:3317)
at Object.fireWith [as resolveWith] (jquery-3.2.1.js:3447)
at tick (jquery-3.2.1.js:7079)
at Function.jQuery.fx.tick (jquery-3.2.1.js:7405)
at schedule (jquery-3.2.1.js:6783)
但我如果改写把上面的程式码稍微改写:
$(".delete").click(e =>
$(e.target)
.parent().fadeOut(150, function(){$(this).remove()})
)
那程式运行OK也不会出现上述的error讯息
我以为e.target跟this应该是一样的?
所以我不知道为什麽会有这个差异。
想请问一下我的理解哪里有问题?
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 128.125.208.229
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Ajax/M.1516350681.A.EF7.html
1F：推 jmlntw: 变数的 scope 问题，前者你没有把 e 传到 fadeOut 的 call 01/19 16:37
2F：→ jmlntw: back 里。 01/19 16:37
3F：→ WunoW: 改成fadeOut(150, () => $(e.target).remove()) 01/19 17:36
4F：→ WunoW: 而e.target跟$(this)也不可能一样，$(this)是jquery物件 01/19 17:38
5F：推 eight0: 先不问 e.target 和 this，你知道 e 是什麽吗？ 01/19 18:05
呜喔喔 我现在知道怎麽改了但不知道这些怎麽来的
基础不稳QQ，我再回去查一下相关的东西
※ 编辑: NCKUFatPork (128.125.208.229), 01/19/2018 18:16:35
6F：→ EricTao: e0大 可以给个关键字吗? 01/19 18:32
7F：推 comicat: event 01/20 18:41
8F：→ xdraculax: 能用 this 就优先用 this 啊，一楼就正解了 01/21 19:36
9F：推 visa9527: this作用域每层都不一样，传 e 比较不会搞混 01/23 12:22
10F：→ xdraculax: 用 e 是自我设限，要嘛所有主动呼叫动作都要建成事件， 01/24 07:13
11F：→ xdraculax: 要嘛还要代个假 e，多此一举 01/24 07:13