自己实现一个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 ...
随机推荐
- 基于centos6.5安装部署mongdb3.6
注意:不同的版本的centos,mongdb安装方式不同,请注意版本号!! 基于centos6.5安装部署mongdb3.6 方式有多种,本文介绍使用wget命令来下载获取mongdb,具体命令如下 ...
- zookeeper集群的搭建(个人实践可行)
linux 上面 zookeeper 集群(最少3个节点192.168.204.128.192.168.204.129.192.168.204.130)安装 1.创建文件夹/usr/local/zoo ...
- Linux相关问题总结
1.linux没有ifconfig命令 可以使用以下命令查询ip地址: ip addr show ifconfig命令在net-tools工具里,安装命令: yum install net-tools
- SpringMVC云题库错题及答案汇总
试题分析:D,BeanNameViewResolver:这个视图解析器跟XmlViewResolver基本相同,它是通过把返回的逻辑视图名称去匹配定义好的视图bean对象 @ModelAttribut ...
- ionic 实现仿苹果手机通讯录搜索功能
前言 由于之前做的SRM移动应用采用的是ionic1.x框架进行开发的,由于性能方便的诟病,导致用户体验不是很友好,于是想着怎么样去提高应用的性能问题.此时刚好ionic3.x框架已发布,由于ioni ...
- Annotation(注解)介绍
Annotation(注解)是什么: Annotation(注解) 官方的定义: An annotation is a form of metadata, that can be added t ...
- wps实现自动编码
1.打开wps,点击“开始”菜单,选择“标题1”样式,右键选择“修改样式” 2.在修改样式界面,左键点击“格式”选择“编号”选项 3.在打开的界面选择“多级编码”,选中一个样式,点击“自定义”按钮 4 ...
- Python实现12306自动查票程序
这是在网上扒拉过来的,原文链接: http://blog.csdn.net/An_Feng_z/article/details/78631290 目前时间2018/01/04 文中各种接口均为可用,亲 ...
- Java 程序员必须了解的 7 个性能指标
来源:王韵菲 本文中,小编搜集了7个最有影响的衡量标注,让你可以不依赖日志文件来了解应用程序.现在,让我们看看这些性能指标,并了解如何查看并收集它们: 1.响应时间和吞吐量 根据应用程序的响 ...
- 解决npm ERR! Please try running this command again as root/Administrator. 问题
win10下,使用npm 安装插件时报npm ERR! Please try running this command again as root/Administrator的错误, 解决方案:需要删 ...