记录一下自己的调试历程

组件封装经常看到这么一段代码

$.fn.plugin = function (options) {
return this.each(function (i,t) {
new Fun(this, options)
});
}
//组件调用
$(".div").plugin({
str: ""
})
.css({
"border": "1px dotted red"
})
.addClass('aaa');

  

为什么要return为什么要each?

自己调试了一番

发现若没有return,打印$(".div").easySlider({}) 因为这个方法没有返回值所以是undefined

经过return返回,打印$(".div").easySlider({}) 返回当前对象

若为undefined自然就不能够进行.css()或.addClass等方法调用了

这时候可能又纳闷了,直接return this 不就OK了么?

例如:

$.fn.easySlider = function (options) {
new ShowLink(this, options)
return this;
}  

这个时候就要说each了,

jQuery组件封装之return this.each(function () {});的更多相关文章

  1. 下拉菜单的jquery组件封装

    首先晒出封装好的dropdown.js (function($){ 'use strict';//使用严格模式 //构造函数形式 function Dropdown(elem,options){ // ...

  2. jQuery组件系列:封装标签页(Tabs)

    我自己封装的组件,你也行,静态链接地址 http://www.cnblogs.com/leee/p/5190489.html 声明.最好,先把代码拷过去运行一下,其实特别丑~再往下看 我没优化,因为我 ...

  3. 封装两个简单的Jquery组件

    Jquery给我们提供了很大的方便,我们把他看成是一个公共库,以致在这个公共库上延伸出了很多Jquery插件:在项目过程中,有些插件总是不那么令人满意: 主要说两个项目用途: 1.  遮罩层,跟一般的 ...

  4. ***使用jQuery去封装插件(组件化、模块化的思想),即扩展方法

    如何使用jQuery去封装插件,区分扩展全局方法与扩展一个普通的jQuery实例对象的方法 1.给全局对象扩展方法:①$.方法 = function(参数可加可不加){}  ②使用:$.方法(有参数的 ...

  5. 对Raphael画图标的一个jquery简单封装

    公司要做一个项目的demo,要求地图上可以插红旗,所以就用到了Raphael. 因为是个demo,所以地图就用了一张图片,效果如下: 所以为了更好的封装一下这个功能,就写了一个简单的插件:jquery ...

  6. jQuery组件开发之表格隔行选中效果实现

    一.效果展示如下 jQuery组件之表格插件源码 //表格选中插件 //方式一 (function($){ var chosTabBgColor = function(options){ //设置默认 ...

  7. 基于Bootstrap的DropDownList的JQuery组件的完善版

    在前文 创建基于Bootstrap的下拉菜单的DropDownList的JQuery插件 中,实现了DropDownList的JQuery组件,但是留有遗憾.就是当下拉菜单出现滚动条的时候,滚动条会覆 ...

  8. Jquery EasyUI封装简化操作

    //confirm function Confirm(msg, control) { $.messager.confirm('确认', msg, function (r) { if (r) { eva ...

  9. jquery插件封装思路整理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. python mysql使用问题

    (deeplearning2) userdeMBP:ageAndGender user$ python Python |Anaconda, Inc.| ( , ::) [GCC Compatible ...

  2. osg HUD 前景色

    #ifdef _WIN32 #include <Windows.h> #endif // _WIN32 #include<iostream> #include <osgV ...

  3. spring boot入门学习---热部署

    1.maven文件 2.application.properties文件配置

  4. [MongoDB教程] 2.MongoDB的安装与使用

    下载mongodb的版本,两点注意 根据业界规则,偶数为稳定版,如3.2.X:奇数为开发版,如3.3.X 32bit的mongodb最大只能存放2G的数据,64bit就没有限制 MongoDB官网安装 ...

  5. git帮助和小结

    获取帮助 想了解 Git 的各式工具该怎么用,可以阅读它们的使用帮助,方法有三: $ git help <verb> $ git <verb> --help $ man git ...

  6. MySQL数据库表的设计和优化(下)

    二.基于单表设计的多表设计原则:(1)表关系: 一)一对一关系: 定义: 在这种关系中,关系表的每一边都只能存在一个记录.每个数据表中的关键字在对应的关系表中只能存在一个记录或者没有对应的记录.这种关 ...

  7. 【Leetcode_easy】744. Find Smallest Letter Greater Than Target

    problem 744. Find Smallest Letter Greater Than Target 题意:一堆有序的字母,然后又给了一个target字母,让求字母数组中第一个大于target的 ...

  8. iOS-iphone网络编程总结

    iphone网络编程总结 一:确认网络环境3G/WIFI 1. 添加源文件和framework        开发Web等网络应用程序的时候,需要确认网络环境,连接情况等信息.如果没有处理它们,是不会 ...

  9. 如何区分进程和线程ps -eLf

    方式 使用ls /proc/pid/task/ 查看线程 使用ps -eLf命令/ps aux -L/ps aux -el 使用pstree 进程和线程 进程是资源分配的最小单位 线程是cpu时间片分 ...

  10. 推特Twitter视频下载的2种方法

    Twitter上面的小视频越来越受欢迎了,其实,从社会发展的角度看,短视频的流行是一种必然的趋势.首先,智能手机和高速网络的普及,让人们的碎片化时间得以利用.坐地铁.吃饭的时间,点开一个视频段子.学一 ...