先上图,说场景

假设默认选中的是item1,我现在选中item3了,有时候需要对item1做一些别的处理。常见的做法是,切换选中状态前找到当前选中(item1),或者每次选中后选中的项记录在中间变量。

这样处理没任何问题,不过心理总有点怪怪的,最好代码分离,就像这样:

$(this).unselect(fn_unselect).select(fn_select),具体代码是这样的:

$(function ()
{
$.$ul('#menu').children().each(function ()
{ $(this).unselect(function ()
{
$(this).removeClass('selected'); }).select(function ()
{
            $(this).addClass('selected')
          }); 
        });
      });

用到的扩展函数:

 $.fn.extend({
unselect: function (callback)
{
//this指unselect的项
if (this[0].tagName === 'LI' && typeof callback === 'function')
{
this.data('unselect', callback);
return this;
}
},
select: function (callback)
{
//this指select的项
if (this[0].tagName === 'LI' && typeof callback === 'function')
{
this.data('select', callback);
return this;
}
}
});
$.extend({
$ul: function (selector)
{
var res = $(selector);
if (res[0].tagName !== 'UL') return undefined;
res.children().each(function ()
{
//实际上这应该是clickAfter事件,此处用setTimeout(fn,delay);代替。即使不用此函数也会先于自定义的click事件
$(this).live('click', function ()
{
              var that = this;
var clickAfter=function ()
{
//处理unselect
var unselecting =  $(that).siblings('.selected');
unselecting.data('unselect').call(unselecting); //处理select
var selecting=$(that)
selecting.data('select').call(selecting); };
setTimeout(clickAfter, 1);//确保在click后执行
});
});
return res;
}
});

给菜单加个优雅的unselect事件的更多相关文章

  1. React中如何优雅的捕捉事件错误

    React中如何优雅的捕捉事件错误 前话 人无完人,所以代码总会出错,出错并不可怕,关键是怎么处理. 我就想问问大家react的错误怎么捕捉呢? 这个时候: 小白:怎么处理? 小白+: ErrorBo ...

  2. [Ext.Net] 1.x GridPanel列数过多给Menu菜单加滚动条

    转自:http://www.ext.net.cn/thread-1944-1-2.html 当GirdPanel列数过多,查看列的显示隐藏时会出现下面下面情况,有部分超出了界面被遮罩住了   要解决这 ...

  3. 雷林鹏分享:jQuery EasyUI 树形菜单 - 树形菜单加载父/子节点

    jQuery EasyUI 树形菜单 - 树形菜单加载父/子节点 通常表示一个树节点的方式就是在每一个节点存储一个 parentid. 这个也被称为邻接列表模型. 直接加载这些数据到树形菜单(Tree ...

  4. Linux为grub菜单加密码

    为grub菜单加密码 加入密码后,再次进入单用户或者给下次管理grub需要输入密码 加密操作 /sbin/grub-md5-crypt # 之后输入2次密码会生成加密后字符串 编辑grub加载文件 v ...

  5. AutoCAD菜单加载失败 找不到文件mnc 怎么办

    菜单加载失败,找不到文件 SWFILECONV(mnu/mns/mnc)   找到CAD安装目录下的swfileconv.arx文件,用记事本打开,清空内容,然后保存即可.  

  6. abp web.mvc项目中的菜单加载机制

    abp中的菜单加载机制 在abp中菜单的定义与我们传统写的框架不一样,它是在编写代码的时候配置,而我们一般写的通用权限管理系统中,是后期在后台界面中添加的.这一点有很大不同.abp关于菜单的定义及管理 ...

  7. angularjs数据异步加载时的绑定事件

    // 顶级菜单项的鼠标移入和移出操作 $(document).on({ mouseover: function () { ; ; if (top + $(this).children('ul').ou ...

  8. ASP.NET Repeater嵌套Repeater实现菜单加载

    在KS系统中要实现从数据库中读取界面权限文件实现菜单.界面的动态加载. 效果图: ASP.NET界面代码 <div id="menu-container"> <a ...

  9. (js有关图片加载问题)dom加载完和onload事件

    引用旺旺的话...哈哈哈DOMContentLoaded事件表示页面的DOM结构绘制完成了,这时候外部资源(带src属性的)还没有加载完.而onload事件是等外部资源都加载完了就触发的.$.read ...

随机推荐

  1. emacs 新手笔记(三) —— 为 emacs 做一点简单的定制

    ilocker:关注 Android 安全(新入行,0基础) QQ: 2597294287 在 emacs 启动时,会加载 ~/.emacs 文件.在该文件中编辑一些 lisp 代码,是一种最为简单的 ...

  2. STM32的USART

    转载自:http://www.cnblogs.com/TrueElement/archive/2012/09/14/2684298.html 几个问题: 1.状态寄存器(USART_SR)中的TC(T ...

  3. Vim命令大全

    1.进入vi的命令 vi filename :打开或新建文件,并将光标置于第一行首 vi +n filename :打开文件,并将光标置于第n行首 vi + filename :打开文件,并将光标置于 ...

  4. 《大转换》,计算会像电力一样变成基础设施,基本是作者10年前写的《IT不再重要》的修订版,3星。

    本书英文版是2014年出的,基本是作者2004年的<IT不再重要>的修订版,还是在说<IT不再重要>的那个主题:计算会想电力一样变成技术设施,只需要按需购买. 以下是书中一些观 ...

  5. stanford coursera 机器学习编程作业 exercise 6(支持向量机-support vector machines)

    在本练习中,先介绍了SVM的一些基本知识,再使用SVM(支持向量机 )实现一个垃圾邮件分类器. 在开始之前,先简单介绍一下SVM ①从逻辑回归的 cost function 到SVM 的 cost f ...

  6. stanford coursera 机器学习编程作业 exercise 3(逻辑回归实现多分类问题)

    本作业使用逻辑回归(logistic regression)和神经网络(neural networks)识别手写的阿拉伯数字(0-9) 关于逻辑回归的一个编程练习,可参考:http://www.cnb ...

  7. NOIP2003传染病控制[按层DFS]

    题目背景 近来,一种新的传染病肆虐全球.蓬莱国也发现了零星感染者,为防止该病在蓬莱国大范围流行,该国政府决定不惜一切代价控制传染病的蔓延.不幸的是,由于人们尚未完全认识这种传染病,难以准确判别病毒携带 ...

  8. SilverFoxServer出炉!!

    SilverFoxServer是啥?各位看官搜一下SmartFoxServer便知 是一套服务端+客户端通迅框架,快速搭建起回合制,棋牌类的联机 网页游戏 SilverFoxServer的特点包括 用 ...

  9. centos 命令集合

    链接: http://www.cnblogs.com/zitsing/archive/2012/05/02/2479009.html http://www.centoscn.com/CentOS/he ...

  10. android 混淆文件proguard.cfg详解

    -optimizationpasses 5  [代码压缩级别]-dontusemixedcaseclassnames [混淆时不会产生形形色色的类名 ]-dontskipnonpubliclibrar ...