//1、自定义对象级别的插件
<script type="text/javascript" src="Plugin/jquery.lifocuscolor.js"></script>//自定义插件文件
<script type="text/javascript">
$(function() {
$("#u1").focusColor("red");//调用自定义的插件
})
</script>
<ul id="u1">
<li><span>张三</span><span>男</span></li>
<li><span>李四</span><span>女</span></li>
<li><span>王五</span><span>男</span></li>
</ul>
-------------------jquery.lifocuscolor.js----------------------------
/// <reference path="jquery-1.4.2-vsdoc.js"/>
/// <reference path="jquery-1.4.2.js"/>
/*------------------------------------------------------------/
功能:设置列表中表项获取鼠标焦点时的背景色
参数:li_col【可选】 鼠标所在表项行的背景色
返回:原调用对象
示例:$("ul").focusColor("red");
/------------------------------------------------------------*/
; (function($) {
$.fn.extend({
"focusColor": function(li_col) {
var def_col = "#ccc"; //默认获取焦点的色值
var lst_col = "#fff"; //默认丢失焦点的色值
//如果设置的颜色不为空,使用设置的颜色,否则为默认色
li_col = (li_col == undefined) ? def_col : li_col;
$(this).find("li").each(function() { //遍历表项<li>中的全部元素
$(this).mouseover(function() { //获取鼠标焦点事件
$(this).css("background-color", li_col); //使用设置的颜色
}).mouseout(function() { //鼠标焦点移出事件
$(this).css("background-color", "#fff"); //恢复原来的颜色
})
})
return $(this); //返回jQuery对象,保持链式操作
}
});
})(jQuery);
//2、自定义类级别的插件(如加和$.addNum 和 减差$.subNum)
<script type="text/javascript" src="Plugin/jquery.twoaddresult.js"></script>
<script type="text/javascript">
$(function() {
$("#Button1").click(function() {
$("#Text3").val(
$.addNum($("#Text1").val(),$("#Text2").val()));
}); //调用自定义的插件计算两数之和
$("#Button2").click(function() {
$("#Text6").val(
$.subNum($("#Text4").val(), $("#Text5").val()));
}) //调用自定义的插件计算两数之差
})
</script>
-----------------------------jquery.twoaddresult.js-------------------------
/// <reference path="jquery-1.4.2-vsdoc.js"/>
/// <reference path="jquery-1.4.2.js"/>
/*------------------------------------------------------------/
功能:计算二个数字相加或相减的结果
参数:数字p1,p2
返回:两数相加后的结果
示例:$.AddNum(1,2);$.subNum(3,1);
/------------------------------------------------------------*/
; (function($) {
$.extend({
"addNum": function(p1, p2) {
//如果传入的数字不为空,使用传入的数字,否则为0
p1 = (p1 == undefined) ? 0 : p1;
p2 = (p2 == undefined) ? 0 : p2;
var intResult = parseInt(p1) + parseInt(p2);
return intResult;
},
"subNum": function(p1, p2) {
//如果传入的数字不为空,使用传入的数字,否则为0
var intResult = 0;
p1 = (p1 == undefined) ? 0 : p1;
p2 = (p2 == undefined) ? 0 : p2;
if (p1 > p2) { //如果传入的参数前者大于后者
intResult = parseInt(p1) - parseInt(p2);
}
return intResult;
}
});
})(jQuery);
分享到:
相关推荐
基于jQuery淡入淡出可自动切换的幻灯插件,原型是前几天写的一个幻灯效果,因为一个小bug卡了两天,然后清空之前写的代码,重新整理思路写出来的. 思维是个很诡异的东西,一旦陷入某个死角,很难逃出. 惟有冷却一些时间,...
自定义滚动条美化jQuery插件是一款基于jquery实现的易滚动自定义滚动条美化插件。本作品由【站长素材】收集整理,转载请注明出处!
今天为大家推荐的是2013年的第一期,在这期里面十个jQuery插件涵盖了响应式的网格布局插件、图片放大插件、表单元素中自定义select插件,google 地图插件、文件拖放上传插件、tooltip提示插件、3D旋转菜单等等。...
jQuery方法: 大部分jQuery插件都是这种类型的插件,由于这种插件是将对象方法封装起来,在jQuery选择器获取jQuery对象过程中进行操作,从而发挥jQuery强大的选择器优势。 2. 全局函数: 也可以把自定义的功能函数...
学习jQuery简单伸缩菜单代码实例 50.一款jquery仿flash滑动左侧菜单插件代码下载 51.一款jQuery实现伸缩型菜单源码下载 52.一款jQuery制作仿FLASH动感导航菜单效果(附PSD) 53.又一款jquery蓝色经典的三级...
根据一周每天的每小时划分成一个个小区域,自定义选择区域,获取时间选择。网上没找到符合要求的就自己整理了一个插件。2种模式,一种每节为一小时,一种每节为半小时。
\contentsline {chapter}{Contents}{2}{section*.1} {1}Java基础}{17}{chapter.1} {1.1}基本语法}{17}{section.1.1} {1.2}数字表达方式}{17}{section.1.2} {1.3}补码}{19}{section.1.3} {1.3.1}总结}{23}{...
1.jQuery实现的右侧选项卡焦点图片轮播动画 jQuery实现的右侧选项卡焦点图片轮播动画特效源码,是一段清新可爱的焦点图轮播代码,支持自动轮播与手动点击,是一段不错的焦点图切换代码。 在线演示 源码下载 2....
最新Python3.5零基础+高级+完整项目(28周全)培训视频学习资料;本资料仅用于学习。 【课程内容】 第1周 开课介绍 python发展介绍 第一个python程序 变量 字符编码与二进制 字符编码的区别与介绍 用户交互程序 if ...
在该教程中你将学会如何使用jQuery的Easing插件及2D Transform插件创建自定义的动画横幅。教程的想法是将不同的元素以自定义动画的形式融入到横幅中去。 查看实例 2. Moving Boxes Carousel with jQuery ...
2014年5月28日-V0.7(测试版)-滑块现在是自定义蓝色主题。 -填充和边距调整。 -服务器状态现在通过javascript加载。 2014年5月28日-V0.6(测试版)-玩家的脑袋现在全部装入。 -将鼠标悬停在玩家上方,即可看到其...
- 代码重做,以消除对jQuery的需求,并促进清单版本2 - 启用事件页面 - 不改变逻辑,没有新的功能 这个编辑的主要目的是使其事件页面启用,因此在不需要时卸载,从而节省内存。 ================= 更新日志: ...
并且会对这些插件做一些简单的Demo实现 存放到配套提供的程序包demo文件夹下 以便大家学习和使用 本期文档中将官方提供的所有附加插件的API都整理并存放到Extension节点下了 这些扩展的demo在附带的程序包中已经提供...
由于网友需要,今天特将一个弹窗窗口特效整理出来给大家使用。包括:弹出窗口特效、自定义滚动条,左右焦点图切换多种效果。 效果:点击图片后弹出一个窗口,大小固定死,始终处于网页中间位置,多出部分可自定义...
jQuery UI很强大,其中的日期选择插件Datepicker是一个配置灵活的插件,我们可以自定义其展示方式,包括日期格式、语言、限制选择日期范围、添加相关按钮以及其它导航等。 之前做的一个排班考勤系统,跟时间打交道较...
07 jquery扩展与插件 08 jquery扩展补充 09 本周作业轮播图以及思路 第45章 轮播图片css部分 轮播图片js部分 第46章 01 数据库与dbms的概念 02 sql规范 03 数据库操作DDL 04 python s3 day46 mysql的数据类型 05...
-如何自定义Javascript脚本和C#处理函数来响应键盘事件。 -为Tree增加AutoLeafIdentification属性。 -增加示例(tree_auto_leaf_identification.aspx)(feedback:wdrabbit)。 +2009-11-17 v2.1.4 -修正...
自定义JQuery插件,完整的类库,基于Less等。 标题 主标题 Bootstrap和普通的HTML页面一样,定义标题都是使用标签到,只不过Bootstrap覆盖了其默认的样式,使用其在所有浏览器下显示的效果一样,具体定义的规则可以...