自己实现一个jQuery插件
<script src="https://cdn.staticfile.org/jquery/2.0.3/jquery.min.js"></script>
<table class='mainTable' id='tbl'>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
</table>
<script>
$(function(){
/* 非插件实现行背景高亮
$('.mainTable tr').mouseover(function(){
$(this).css('backgroundColor','yellow').siblings().css('backgroundColor','white');
});
*/
$('.mainTable').setTableColor();
});
////自己实现jquery插件(可单独放到js文件中):
/*
* 鼠标放table行上背景高亮
* 插件的使用:$('#tbleId').setTableColor();
*/
;(function($){//为了把前面代码视为一个整体故第一个字符是分号,$是jquery对象。
//注意:$.fn.extend()里面以“key-value”形式写函数
$.fn.extend({
setTableColor:function(){//行背景高亮函数
$('tr',this).mouseover(function(){//this是table对象
$(this).css('backgroundColor','#F2F4FF').siblings().css('backgroundColor','white');//this是表行
});
return this;//本句为了能链式编程
}
});
})(jQuery);
</script>
自己实现一个jQuery插件的更多相关文章
- 做了一个jquery插件,使表格的标题列可左右拉伸
示例下载 插件名称命名为:jquery.tableresize.js,代码如下: /* Writen by mlcactus, 2014-11-24 这是我封装的一个jquery插件,能够使table ...
- Jquery 类似新浪微博,鼠标移到头像,用浮动窗口显示用户信息,已做成一个jquery插件
请注意!!!!! 该插件demo PHP 的 demo下载 C#.NET的demo下载 需要如下图, 1.鼠标移动到头像DIV时,Ajax获取数据,并让浮动DIV显示出来. 2.鼠标可以移动到上面浮 ...
- 如何写一个jquery插件
本文总结整理一下如何写一个jquery插件?虽然现今各种mvvm框架异常火爆,但是jquery这个陪伴我们成长,给我们带来很多帮助的优秀的库不应该被我们抛弃,写此文章,作为对以往欠下的笔记的补充, ...
- 你真的需要一个jQuery插件吗
jQuery的插件提供了一个很好的方法,节省了时间和简化了开发,避免程序员从头开始编写每个组件.但是,插件也将一个不稳定因素引入代码中.一个好的插件节省了无数的开发时间,一个质量不好的插件会导致修复错 ...
- 如何去定义一个jquery插件
扩展jquery的时候.最核心的方法是以下两种: $.extend(object) 可以理解为jquery添加一个静态方法 $.fn.extend(object) 可以理解为jquery实例添加一个方 ...
- 开发一个jQuery插件——多级联动菜单
引言 开发中,有好多地方用到联动菜单,以前每次遇到联动菜单的时候都去重新写,代码重用率很低,前几天又遇到联动菜单的问题,总结了下,发现可以开发一个联动菜单的功能,以后想用的时候就方便多了.项目中每个页 ...
- 如何使用jQuery写一个jQuery插件
jQuery插件其实是前端框架的思维,构成一个框架,个人认为必须满足以下几个基础条件:1. 可重用,2. 兼容性,3. 维护方便,虽说现在有很多比较成熟的前端框架,但是也有部分存在配置麻烦,学习成本大 ...
- 我的第一个jquery插件:下拉多选框
<!DOCTYPE HTML> <html> <head> <title> New Document </title> <meta n ...
- 自己在项目中写的一个Jquery插件和Jquery tab 功能
后台查询结果 PDFSearchResult实体类: [DataContract(Name = "PDFSearchResult")] public class PDFSearch ...
随机推荐
- react native进一步学习(NavigatorIOS 学习)
特别申明:本人代码不作为任何商业的用途,只是个人学习的一些心得,为了使得后来的更多的程序员少走一些弯路.*(如若侵犯你的版权还望见谅)*. 开发工具:WebStorm,xcode 1. rn的创建的时 ...
- xpath简单实用
一.xpath 基本语法 /html /html/head/title 绝对路径(一层层的查找) /html//title 相对于当前节点 //title/./../.. . 当前节点 ..父节点 . ...
- login.html
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1 ...
- ABP异常处理
1.编译器错误消息: CS0012: 类型“System.Object”在未被引用的程序集中定义.必须添加对程序集“System.Runtime, Version=4.0.0.0, Culture=n ...
- python模块和包(模块、包、发布模块)
模块和包 目标 模块 包 发布模块 01. 模块 1.1 模块的概念 模块是 Python 程序架构的一个核心概念 每一个以扩展名 py 结尾的 Python 源代码文件都是一个 模块 模块名 同样也 ...
- python cmd的各种实现方法及优劣
Python_cmd的各种实现方法及优劣(subprocess.Popen, os.system和commands.getstatusoutput) 目前我使用到的python中执行cmd的方式有 ...
- JS 返回上一页并刷新代码整理
一:JS 重载页面,本地刷新,返回上一页: <a href="javascript:history.go(-1)">返回上一页</a> <a href ...
- 20165214 2018-2019-2 《网络对抗技术》Exp1 PC平台逆向破解 Week3
<网络对抗技术>Exp1 PC平台逆向破解之"逆向及Bof基础实践说明" Week3 一. 实验预习 1.什么是漏洞?漏洞有什么危害? 漏洞就是在计算机硬件.软件.协议 ...
- 马凯军201771010116《面向对象与程序设计Java》
实验十八 总复习 实验时间 2018-12-30 1.实验目的与要求 (1) 综合掌握java基本程序结构: (2) 综合掌握java面向对象程序设计特点: (3) 综合掌握java GUI 程序设 ...
- koala 的使用
koala是一个前端预处理器语言图形编译工具,支持Less.Sass.Compass.CoffeeScript,帮助web开发者更高效地使用它们进行开发.跨平台运行,完美兼容windows.linux ...