jquery js

看jquery cookbook 读书笔记  

  $(this)是不能随便乱用滴。

  举个栗子

  

1 $(document).ready(function(){
2         $(".clicky").click(function(){
3             $(this).addClass("clicked");
4             setTimeout(function(){
5                 $(this).removeClass("clicked");
6             },5000);
7         });
8     });

  点击这个class为clicky的button,给第3行加断点。跳转到第3行,加了clicked的class

给第5行加断点,5s后跳入执行该行,可button的class却没有移除clicked

  原因

  jquery事件处理程序中,this是处理时间的dom元素,所以$(this)是用于该元素的一个jquery包装器,所以第一个可以添加class;

  setTimeout是以直接函数调用的方式工作,this指window对象

  解决方法

  

$(document).ready(function(){
        $(".clicky").click(function(){
            var $element = $(this);
            $element.addClass("clicked");
            setTimeout(function(){
                $element.removeClass("clicked");
            },5000);
        });
    });

  为什么将this或者$(this)复制给一个局部变量就可以了呢?——js为参数和函数的局部变量创建了一个闭包。

  

  书中写的闭包三条原则:

  1.可以再js函数中嵌套另一个函数,嵌套可以为多级;

  2.函数不仅能读写自己的参数和局部变量,还能读写潜逃函数中的变量;

  3.前一条原则始终有效,即使外部函数已经返回之后再调用内部函数也是如此(如事件处理函数或setTimeout)

  不管函数是命名的还是匿名的,上述原则对所有函数都适用。但this是js特殊的关键字,不是局部变量或者函数参数,所以这些原则不适合它。将this的值复制到一个局部变量中就能利用闭包使该值在任何潜逃函数中都有用。

  

jquery js

时间: 2024-10-26 09:57:21

jquery js的相关文章

jquery.js:8672 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

html5谷歌流浪器报错:jquery.js:8672 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. 解决方法: 所有的a标签加上:javascript:void(0) <a href="

检测jQuery.js是否已加载的判断代码

转载自http://www.jb51.net/article/27185.htm 测类.方法.变量或属性是否已存在,这是Javascript编程基础知识.在这里我们就是要检测jQuery()或$()函数是否存在 当然,该方法不局限于jQuery的检测,对与任何Javascript变量或函数都是通用的. 当前网页加载jQuery后,jQuery()或$()函数将会被定义,所以检测jQuery是否已经加载存在以下2种方法: 方法1: 复制代码代码如下: if (jQuery) { // jQuery

jquery.js和jquery.min.js的区别介绍

jquery官网提供2种jQuery的下载,一种是jquery.js另一种是jquery.min.js 文件名不一定完全相同,但通常情况下: jquery.js是完整的未压缩的jQuery库,文件比较大,一般用于阅读学习源码或修改源码,一般不用于线上项目. jquery.min.js是由完整版的jQuery库经过压缩得来,压缩后功能与未压缩的完全一样,只是将其中的空白字符.注释.空行等与逻辑无关的内容删除,并进行一些优化.这个版本一般用于网站引用使用,减小文件体积,降低网站流量,提升访问速度等.

jquery&amp;js $(this) &amp; this

序言:在使用jquery操作js时,经常整不明白this与$(this).抽空仔细测试了一把,记录下来以供在忘记的时候拉出来参考参考! $(this)生成的是什么 $()生成的是什么呢?实际上$()=jquery(),那么也就是说返回的是一个jquery的对象. 题外话:通常我们为了简便直接使用$(),实际上,该函数省略了一个参数context,即$(selector)=$(selector,document).如果指定context,可以指定context为一个dom元素集或者jquery对象

Jquery/js submit()无法提交问题

有朋友可能会直接利用js或jquery来提交数据而不是使用表单直接提交了,小编来给大家介绍小编碰到的一个问题就是 submit()无法提交,下面我们来看解决办法与原因分析. jquery无法提交  代码如下 复制代码 <form action="register.php" method="post"> <label>邮箱:</label> <input type="text" class="lo

JS文件中加载jquery.js

原文链接:http://blog.csdn.net/whatday/article/details/39553451 最近有一个需求: 1.在一个html中只能引入一个JS文件 不能有JS代码和其他JS文件的引入 2.这个JS文件中 还要引入其他的JS文件 3.所有JS功能都写在这个JS文件中 这些代码用到了jQuery相关的东东 所以这里第一个需要解决的就是怎么引入jquery.js 在网上搜索了很多方法都不太实用,由于我自己离开WEB多年 最后向朋友询问得到以下代码 1.js [javasc

What&#39;s the difference between jquery.js and jquery.min.js?

They are both the same functionally but the .min one has all unnecessary characters removed in order to make the file size smaller. Just to point out as well, you are better using the minified version (.min) for your live environment as Google are no

jquery.js 库中的 选择器

<html><head><script type="text/javascript" src="jquery.js"></script><script type="text/javascript">$(document).ready(function(){ $("button").click(function(){ $(this).hide();  这个  this

JQuery中关于jquery.js与jquery.min.js的比较探讨

jquery-1.4.2.min.js是优化的,而query-1.4.2.js是易于开发着阅读的. 刚刚开始接触JQuery的时候,下载来的文件包括jquery.vsdoc.js, jquery.min.js和jquery.js 对于各个文件的作用以及该引入哪个包不是很清楚.有时候引入jquery.min.js能够执行,有时候引入jquery.js也能执行.现在做一下简单 的说明. 两个文件的作用是完全一样的,但从文件或上来看我们知道jquery.min.js应该是迷你版的意思,也就是文件会很小

JQuery+Js 获取浏览器高度和宽度

JQuery-------做手机Web开发做浏览器兼容用到了,所以在网上找了些汇总下. alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(document.body).height());//浏览器当前窗口文档body的高度 alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括bor