jquery 中 箭头函数 中 “this“ 问题
问题场景
<form id="loginForm">
<label>邮件</label>
<input name="email" type="email" placeholder="请输入邮件地址">
<label>密码</label>
<input name="password" type="password" placeholder="请输入密码">
<button type="submit" ">登录</button>
</form>
<script>
$('#loginForm').on('submit', () => {
console.log(this); // window对象?
console.log($(this)); // window对象?
return false;
})
</script>
描述:上述事件监听函数的两处输出应该分别是 表单对象 和 被jquery封装的表单对象 才对,为什么是window对象?
原因寻找:
有大佬这样说:
“无解,因为箭头函数在创建时就已经绑定了this, 后面在执行时不能重新绑定。在JQuery中通常不要用箭头函数,因为JQuery在执行回调函数时很多时候会为它动态绑定一个this, 所以你不要在创建时为它绑定this, 也不要用箭头函数。”
() => {};
// 相当于:
funciotn(){}.bind(this);
解决方案:
在jquery中不要使用箭头函数!
作者:Hong•Guo
出处:https://www.cnblogs.com/ghnb1/p/15856523.html
版权:本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。
分类:
问题记录
Buy me a cup of coffee ☕.
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix