自定义函数与.ready()中使用$(this)获取元素字号的问题咨询

嘿，这个问题的核心其实是JavaScript中this的指向规则，我来给你拆解清楚：

首先，先明确为什么语句1能正常运行：

$(function(){ $('.a').click(function(){ alert($(this).css('font-size')); }) })

这里的匿名函数是jQuery的事件处理函数，当元素被点击时，jQuery会自动把this绑定到触发点击的DOM元素上，所以$(this)能正确包装成jQuery对象，拿到元素的字号，完全没问题。

接下来分析你说的语句2和语句3的问题（我结合常见的错误写法推断，应该和你的情况匹配）：

语句2的问题：普通函数调用导致this指向全局对象 #

如果你的语句2是像下面这样写的：

// 语句2示例
$(function(){ $('.a').click(function(){ adjust_size(); }); })

这里调用adjust_size()属于普通函数调用，在非严格模式下，this默认指向全局对象（浏览器环境里就是window）。所以你在adjust_size里的$(this)其实是$(window)，自然拿不到.a元素的字号，肯定无法得到预期结果。

语句3的问题：错误绑定this或全局调用 #

如果你的语句3是类似下面的写法：

// 语句3示例1：直接全局调用
$(function(){ adjust_size(); })
// 语句3示例2：错误绑定了jQuery对象而非DOM元素
$(function(){ $('.a').click(adjust_size.bind($('.a'))); })

第一种情况和语句2的问题一致，this指向window；第二种情况你错误地把jQuery对象绑定给了this，但事件处理中this应该是原生DOM元素，导致$(this)无法正确识别目标元素，自然拿不到正确的字号。

怎么修复？ #

要让adjust_size里的$(this)正确指向点击的元素，有两种常用方法：

1. 直接把adjust_size作为事件处理函数传递
   jQuery会自动帮你把this绑定到触发事件的DOM元素，写法如下：

   function adjust_size(){ alert($(this).css('font-size')); }
   $(function(){ $('.a').click(adjust_size); })
   

2. 用call/apply手动绑定this
   如果需要在匿名回调里先做其他逻辑再调用adjust_size，可以用call把当前元素的this传递进去：

   $(function(){ $('.a').click(function(){ 
       // 这里可以添加其他前置逻辑
       adjust_size.call(this); 
   }); })
   

这样adjust_size里的this就会正确指向点击的.a元素，就能拿到你想要的字号啦～

内容的提问来源于stack exchange，提问作者Mizok.H