jQuery插件中的this指的是什么
在jQuery插件的范围里, this关键字代表了这个插件将要执行的jQuery对象, 但是在其他包含callback的jQuery函数中,this关键字代表了原生的DOM元素。这常常会导致开发者误将this关键字无谓的包在jQuery中。
可以看下面的例子:
<div class="content" style="background:#ff5000"> </div>
<div class="box">jojiojoi <div class="inner"></div> </div>
html代码结构如上,然后写一个非常简单的插件,用于输出最高的div的高度值。
js代码是这样的:
(function ($) {
$.fn.maxheight = function(){
//在插件范围内,this指的是jquery插件将要执行的对象。并不是原生的dom元素,
//因此,直接用this即可,不需要用$(this).
var max = 0;
console.log(this);//此处this指的是要遍历的jquery对象集合
this.each(function(){
console.log(this);//此处this指的是dom元素,即要遍历的每一个dom元素。
max = Math.max(max,$(this).height());//所以这里要使用$选取dom元素。
});
return max;
}
})(jQuery);
var maxheight = $("div").maxheight();
console.log(maxheight);
执行的结果是这样的:

所以很清楚的可以看到,第一个this指的是jquery对象,而在会面的返回函数中,this指的是div元素,所以必须使用$将this包裹起来,选取dom元素,再进行操作。
jQuery插件中的this指的是什么的更多相关文章
- 详解jquery插件中;(function ( $, window, document, undefined )的作用
在jquery插件中我们经常看到以下这段代码 1 2 3 ;(function ( $, window, document, undefined ){ //函数体内具体代码 })(jQuery, wi ...
- jquery插件中(function ( $, window, document, undefined )的作用
在jquery插件中我们经常看到以下这段代码 ;(function ( $, window, document, undefined ){ //函数体内具体代码 })(jQuery, window,d ...
- 详解jquery插件中(function ( $, window, document, undefined )的作用。
1.(function(window,undefined){})(window); Q:(function(window,undefined){})(window);中为什么要将window和unde ...
- jquery插件中使用ajax并且获取使用插件的对象
jquery插件中使用ajax后无法在里面获取this 解决办法是在函数内使用ajax前声明变量 $this=this 然后再ajax中使用$this
- jquery插件中找到好玩插件 http://www.jq22.com/
超实用的angular.js无刷新分页完整案例 http://www.jq22.com/jquery-info14714 js联动选择插件mobileSelect.js http://www.jq22 ...
- jquery插件分类与编写详细讲解
jquery插件分类与编写详细讲解 1. 插件种类 插件其实就是对现有的方法(或者叫函数)做一个封装,方便重用提高开发效率. jQeury主要有2种类型 1)实例对象方法插件 开发能让所有的j ...
- jQuery库中的变量$和其它类库的变量$冲突解决方案
jQuery.noConflict();//把变量$给其它插件 /* 由于把jQuery插件中的变量$给了其它插件使用 那么在调用jQuery插件的时候只能使用jQuery 但是这样很不方便 1.其实 ...
- 解决jQuery插件重名问题
jQuery第三方插件命名冲突: 1.以某种方法为自己创建的jQuery插件添加命名空间,以免名称冲突.比如:在自己的插件名之前添加某类名称前缀. 2.避免影响全局命名空间.将自己的所有函数调用和变量 ...
- jQuery插件综合应用(一)注册
一.介绍 注册和登录是每个稍微有点规模的网站就应该有的功能.登陆功能与注册功能类似,也比注册功能要简单些.所以本文就以注册来说明jQuery插件的应用. jQuery插件的使用非常简单,如果只按照jQ ...
随机推荐
- 如何配置Linux系统的网络IP地址
一台安装了Linux系统的电脑如果想要联网,首先要做的就是进行网络配置.今天小编就以CentOS6.4系统为例为大家介绍整个网络配置的过程,虽然只是以CentOS6.4系统为例,但是其它的Linux系 ...
- [LeetCode] Single Number 单独的数字
Given an array of integers, every element appears twice except for one. Find that single one. Note:Y ...
- ElasticSearch第二步-CRUD之Sense
ElasticSearch系列学习 ElasticSearch第一步-环境配置 ElasticSearch第二步-CRUD之Sense ElasticSearch第三步-中文分词 ElasticSea ...
- Activity的生命周期
Activity的生命周期 以往我们实现页面间的跳转都是实例化Intent类的对象,但是页面在我们眼前的出现与消失没有我们所看到的那么简单,它有一个复杂的生命周期,一个页面的出现,被覆盖,再次出现,被 ...
- 【WPF】 通过FarPoint显示Excel
1.FarPoint 只支持winform,在Wpf中要引用:WindowsFormsIntegration.dll2.*.xaml文件引用 xmlns:wfi ="clr-names ...
- Spring在非web应用中关闭IoC容器 (registerShutdownHook)
在基于web的ApplicationContext实现中,已有相应的实现来处理关闭web应用时恰当地关闭Spring IoC容器.但,如果你正在一个非web应用的环境下使用Spring的IoC容器,如 ...
- RESTful API 设计指南
转自:http://www.ruanyifeng.com/blog/2014/05/restful_api.html 网络应用程序,分为前端和后端两个部分.当前的发展趋势,就是前端设备层出不穷(手机. ...
- oracle的round函数和trunc函数
--Oracle trunc()函数的用法/**************日期********************/1.select trunc(sysdate) from dual --2013- ...
- ubuntu中phpmyadmin密码忘记
在安装mysql时,默认只让你设置了root的密码,如果root的密码忘记,处理办法如下 第一步: 这时你需要进入/etc/mysql目录下,然后sudo vim/vi debian.cnf查看里面的 ...
- windows中LNK文件打开方式恢复(每日一修(1))
相信有些用户曾试过错误地把LNK文件的打开方式更改其他文件,导致系统所有的快捷方式都失效.在vista与Windows7系统还不普遍使用的时候,相信大家会有点惊慌失措,不要紧,下面只要大家进行如下操作 ...