jquery中this的使用说明

原来js中的this这么好用


复制代码 代码如下:

$(document).ready(function(){
  var DragElement=null;
  $("#zz").mousedown(function(){
  DragElement=this;//这时this指的就是$("#zz")对象
  $(document).mousemove(function(){
  如果直接$(this).css("left")//由于是在mousemove内,这样this对象就不是$("#zz"),
  这时可以用$(DragElement).css("left")//这样取的就是$("#zz")
})
})
})

$(this)生成的是什么

$()生成的是什么呢?实际上$()=jquery(),那么也就是说返回的是一个jquery的对象。
题外话:通常我们为了简便直接使用$(),实际上,该函数省略了一个参数context,即$(selector)=$(selector,document).如果指定context,可以指定context为一个dom元素集或者jquery对象。

那么依照,$()返回的是jquery对象这一结论,我们可以得出$(this)得到的是一个jquery对象.我们可以使用万能的alert()方法打印出一个对象:
alert($('#btn'));
显示的结果:

该图红色框勾选出来的是一个object,不用考虑,该object自然是jquery的对象咯。也即是说我们用通过$('#btn')来调用jquery的方法和属性等。

this代表什么?

this,编程的人都知道this表示上下文所处的这个对象,这个自然是不错的,可是这个对象到底是个什么对象呢?加入js里面也有getType的话返回的值会是什么呢?其实js里面不需要使用getType,因为我们有万能的alert.请看看下面的代码:


复制代码 代码如下:

$('#btn').bind("click",function(){

alert(this);
alert($(this));
});

根据我们的经验(因为$()生成的是jquery的对象嘛),this自然是一个jquery的对象咯。可是我们看看返回的结果:

返回的是什么?【object HTMLInputElement】——伟大的html对象,嘿嘿。所以我们通常在直接使用this.val()或者直接通过this来调用jquery所特有的方法或属性的时候会报错误: 为什么呢?明知故问!html对象当然“不包含属性或方法”了。那么为什么在一个jquery对象的上下文中调用this返回的是一个html对象而不是jquery对象 呢?翻遍jquery的api文档,貌似jquery中并未对this这一关键字进行过特殊“处理”,也就是说这里this是js中的,而不是jquery重新定义了的。so...当然这仅仅是我自己的想法,如果有对此更了解的朋友可以留言更正。而我们再看一下以上代码中alert($(this));的返回,自然是jquery的对象了,在此调用jquery特有的方法和属性,完全没有问题。

结论:

this,表示当前的上下文对象是一个html对象,可以调用html对象所拥有的属性,方法
$(this),代表的上下文对象是一个jquery的上下文对象,可以调用jquery的方法和属性值。

时间: 2010-09-03

详谈jQuery中的this和$(this)

网上有很多关于jQuery的this和$(this)的介绍,大多数只是理清了this和$(this)的指向,其实它是有应用场所的,不能一概而论在jQuery调用成员函数时,this就是指向dom对象. $(this)指向jQuery对象是无可厚非的,但this就是指向dom对象,这个是因为jQuery做了特殊的处理. 在创建dom的jQuery对象时,jQuery不仅仅为dom创建一个jQuery对象,而且还将dom存储在所创建对象的数组中. 复制代码 代码如下: elem = document

图解JavaScript中的this关键字

JavaScript 是一种脚本语言,支持函数式编程.闭包.基于原型的继承等高级功能.JavaScript一开始看起来感觉会很容易入门,但是随着使用的深入,你会发现JavaScript其实很难掌握,有些基本概念让人匪夷所思.其中JavaScript 中的 this 关键字,就是一个比较容易混乱的概念,在不同的场景下,this会化身不同的对象.有一种观点认为,只有正确掌握了 JavaScript 中的 this 关键字,才算是迈入了 JavaScript 这门语言的门槛.在主流的面向对象的语言中(

javascript与jquery中的this关键字用法实例分析

本文实例分析了javascript与jquery中的this关键字用法.分享给大家供大家参考,具体如下: this 表示当前的对象,这个当前对象可以是表单,<p>等任何元素 1.javascript中this的用法: JS部分: <script type="text/javascript"> function chimg(obj){ obj.src="./images/2.jpg"; } </script> HTML部分: 复制代

jQuery中$this和$(this)的区别介绍(一看就懂)

// this其实是一个Html 元素. // $this 只是个变量名,加$是为说明其是个jquery对象. // 而$(this)是个转换,将this表示的dom对象转为jquery对象,这样就可以使用jquery提供的方法操作. (function($){ $.fn.hilight = function(options){ debug(this); var defaults = { foreground: 'red', background: 'yellow' }; var opts =

跟我学习javascript的this关键字

本文仅就这一问题展开讨论,阅罢本文,读者若能正确回答 JavaScript 中的 What 's this 问题,作为作者,我就会觉得花费这么多功夫,撰写这样一篇文章是值得的. 我们要记住一句话:this永远指向函数运行时所在的对象!而不是函数被创建时所在的对象.也即:谁调用,指向谁.切记- 本文将分三种情况来分析this对象到底身处何方. 1.普通函数中的this 无论this身处何处,第一要务就是要找到函数运行时的位置. var name="全局"; function getNam

js中this用法实例详解

本文实例讲述了js中this用法.分享给大家供大家参考.具体如下: 1. 指向window 全局变量 alert(this) //返回 [object Window] 全局函数 function sayHello(){ alert(this); } sayHello(); 2. 指向该对象(在全局里面this指向window,在某个对象里面this指向该对象,在闭包里面this指向window) var user="the Window"; var box={ user:'the bo

Java中的instanceof关键字在Android中的用法实例详解

在下面介绍Android中如何使用instanceof关键字开发更方便时,先来温习一下java中instanceof的概念. instanceof大部分的概念是这样定义的:instanceof是Java的一个二元操作符,和==,>,<是同一类东西.由于它是由字母组成的,所以也是Java的保留关键字.它的作用是测试它左边的对象是否是它右边的类的实例,返回boolean类型的数据.举个栗子: String s = "I AM an Object!"; boolean isObj

JS中的多态实例详解

多态在面向对象编程语言中是十分重要的.在JAVA中是通过继承来得到多态的效果.如下: public abstract class Animal { abstract void makeSound(); // 抽象方法 } public class Chicken extends Animal{ public void makeSound(){ System.out.println( "咯咯咯" ); } } public class Duck extends Animal{ publi

jquery中cookie用法实例详解(获取,存储,删除等)

本文实例讲述了jquery中cookie用法.分享给大家供大家参考,具体如下: cookie在jquery中有指定的cookie操作类,下面我先来介绍我们在使用cookie操作类时的一些问题,然后介绍正确的使用方法. 使用JQuery操作cookie时 发生取的值不正确的问题: 结果发现cookie有四个不同的属性: 名称,内容,域,路径 $.cookie('the_cookie'); // 读取 cookie $.cookie('the_cookie', 'the_value'); // 存储

JS插件overlib用法实例详解

本文实例讲述了overlib用法.分享给大家供大家参考,具体如下: overLIB 是一个生成提示框与弹出菜单等页面效果的一段非常优秀的JS代码. 它可以简单的通过设置一些参数或命令来改变弹出页面的款式.皮肤与形状,不但如此,它还提供了非常简单的扩展功能,来足客户的不同需求. overLIB 使用非常的简单. 一.在<head></head> 标签内添加: 复制代码 代码如下: <script type="text/javascript" src=&quo

JS正则表达式常见用法实例详解

本文实例讲述了JS正则表达式常见用法.分享给大家供大家参考,具体如下: 前言:正则表达式(regular expression)反反复复学了多次,学了又忘,忘了又学,这次打算把基本的东西都整理出来,加强记忆,也方便下次查询. 学习正则表达式之前首先需要掌握记忆这些基本概念: 1.元字符:(.,\w,\W,\d,\D,\s,/S,^,$,) 字符 含义 . 匹配除了换行符以外的任意字符. \s 代表任意空白符(换行符,制表符,空格) \S 匹配任意非空字符串 \b 匹配单词边界,匹配单词的开头和结

javascript中this用法实例详解

本文实例讲述了javascript中this用法.分享给大家供大家参考,具体如下: JavaScript中的this含义非常丰富,它可以是全局对象,当前对象或者是任意对象,这都取决于函数的调用方式.函数有以下几种调用方式:作为对象方法调用.作为函数调用.作为构造函数调用.apply或call调用. 对象方法调用 作为对象方法调用的时候,this会被绑定到该对象. var point = { x : 0, y : 0, moveTo : function(x, y) { this.x = this

python中尾递归用法实例详解

本文实例讲述了python中尾递归用法.分享给大家供大家参考.具体分析如下: 如果一个函数中所有递归形式的调用都出现在函数的末尾,我们称这个递归函数是尾递归的.当递归调用是整个函数体中最后执行的语句且它的返回值不属于表达式的一部分时,这个递归调用就是尾递归.尾递归函数的特点是在回归过程中不用做任何操作,这个特性很重要,因为大多数现代的编译器会利用这种特点自动生成优化的代码. 原理: 当编译器检测到一个函数调用是尾递归的时候,它就覆盖当前的活跃记录而不是在栈中去创建一个新的.编译器可以做到这点,因

wxPython中listbox用法实例详解

本文实例讲述了wxPython中listbox用法.分享给大家供大家参考.具体如下: # load a listbox with names, select a name and display in title # experiments with wxPython by vegaseat 20mar2005 # Python v2.4 and wxPython v2.5 # If you have not already done so, install Python 2.4 first.

C#中委托用法实例详解

本文实例讲述了C#中委托用法.分享给大家供大家参考.具体分析如下: 这里演示了如何使用匿名委托来计算员工的薪水奖金.使用匿名委托简化了程序,因为无需再定义一个单独的方法. (-:The data for each employee is stored in an object containing personal details as well as a delegate that references the algorithm required to calculate the bonus