jquery通过扩展select控件实现支持enter或focus选择的方法


Posted in Javascript onNovember 19, 2015

本文实例讲述了jquery通过扩展select控件实现支持enter或focus选择的方法。分享给大家供大家参考,具体如下:

/***************************************
* @ author jdkleo
* @ date 2013/2/27
 JQuery SelKeys
USAGE:
 jQuery.selkeys.enter(jQuery("#selcon"));
 jQuery.selkeys.focus(jQuery("#selcon2"));
*****************************************/
(function (jQuery){
 this.version = '(beta)(0.0.1)';
 this.all = {};
 /**---------enter---------**/
 this.enter = function(sel){ 
  var flag = 1;
  var open = function(){ 
   if(flag==1){
    sel.get(0).size = sel.get(0).options.length;
    flag=0;
   }else{
    sel.get(0).size = 1;
    flag=1;
   }
  }; 
  sel.keydown(function(e){ 
    e = e ? e :(window.event ? window.event : null); 
    var code = e.keyCode || e.which || e.charCode;
    if(code == 13)
    {
     open();
     return false;
    }
   });
  sel.blur(function(){
     sel.get(0).size=1;
     flag=1;
     });   
 } 
 /**---------focus---------**/
 this.focus = function(sel){ 
  var flag = 1;
  var open = function(){ 
   if(flag==1){
    sel.get(0).size = sel.get(0).options.length;
    flag=0;
   }else{
    sel.get(0).size = 1;
    flag=1;
   }
  }; 
  sel.focus(function(){ 
    open();
    return false;
   });
  sel.blur(function(){
    sel.get(0).size=1;
    flag=1;
   });
  sel.keydown(function(e){ 
    e = e ? e :(window.event ? window.event : null); 
    var code = e.keyCode || e.which || e.charCode;
    if(code == 13)
    {
     sel.get(0).size=1;
     flag=1;
     return false;
    }
   });
 }
 /**---------all---------**/
 jQuery.selkeys = this;
 return jQuery; 
})(jQuery);

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
Javascript 更新 JavaScript 数组的 uniq 方法
Jan 23 Javascript
jQuery1.6 正式版发布并提供下载
May 05 Javascript
jquery的ajax异步请求接收返回json数据实例
Jun 16 Javascript
使用JS+plupload直接批量上传图片到又拍云
Dec 01 Javascript
jquery+html5制作超酷的圆盘时钟表
Apr 14 Javascript
使用jquery实现的循环连续可停顿滚动实例
Nov 23 Javascript
Angular在一个页面中使用两个ng-app的方法
Feb 20 Javascript
彻底学会Angular.js中的transclusion
Mar 12 Javascript
jQuery插件开发发送短信倒计时功能代码
May 09 jQuery
解决vue项目F5刷新mounted里的函数不执行问题
Nov 05 Javascript
微信小程序顶部导航栏可滑动并选中放大
Dec 05 Javascript
javascript设计模式 ? 访问者模式原理与用法实例分析
Apr 26 Javascript
javascript中checkbox使用方法实例演示
Nov 19 #Javascript
jquery实现表格隔行换色效果
Nov 19 #Javascript
javascript设计简单的秒表计时器
Sep 05 #Javascript
跟我学习javascript的定时器
Nov 19 #Javascript
分享纯手写漂亮的表单验证
Nov 19 #Javascript
javascript获取系统当前时间的方法
Nov 19 #Javascript
jQuery-1.9.1源码分析系列(十)事件系统之事件体系结构
Nov 19 #Javascript
You might like
从C/C++迁移到PHP——判断字符类型的函数
2006/10/09 PHP
php中导出数据到excel时数字变为科学计数的解决方法
2013/02/03 PHP
解析PHP处理换行符的问题 \r\n
2013/06/13 PHP
Laravel如何创建服务器提供者实例代码
2019/04/15 PHP
PHP的图像处理实例小结【文字水印、图片水印、压缩图像等】
2019/12/20 PHP
二行代码解决全部网页木马
2008/03/28 Javascript
JavaScript 密码强度判断代码
2009/09/05 Javascript
js获取时间(本周、本季度、本月..)
2013/11/22 Javascript
JS随机调用指定函数的方法
2015/07/01 Javascript
javascript连续赋值问题
2015/07/08 Javascript
从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别
2016/06/12 Javascript
使用SVG基本操作API的实例讲解
2017/09/14 Javascript
vue 点击按钮增加一行的方法
2018/09/07 Javascript
vue interceptor 使用教程实例详解
2018/09/13 Javascript
Vue+Element自定义纵向表格表头教程
2020/10/26 Javascript
python实现获取客户机上指定文件并传输到服务器的方法
2015/03/16 Python
Flask框架的学习指南之开发环境搭建
2016/11/20 Python
Django中login_required装饰器的深入介绍
2017/11/24 Python
python查询mysql,返回json的实例
2018/03/26 Python
pandas表连接 索引上的合并方法
2018/06/08 Python
python去重,一个由dict组成的list的去重示例
2019/01/21 Python
python中while和for的区别总结
2019/06/28 Python
python创建与遍历List二维列表的方法
2019/08/16 Python
PyCharm使用之配置SSH Interpreter的方法步骤
2019/12/26 Python
Pytorch 实现focal_loss 多类别和二分类示例
2020/01/14 Python
Python偏函数实现原理及应用
2020/11/20 Python
CSS3 清除浮动的方法示例
2018/06/01 HTML / CSS
Top Villas美国:豪华别墅出租和度假屋
2018/07/10 全球购物
新闻专业个人自我评价
2013/09/21 职场文书
学习十八大报告感言
2014/02/04 职场文书
国贸专业毕业求职信
2014/06/11 职场文书
关爱留守儿童主题班会
2015/08/13 职场文书
《用字母表示数》教学反思
2016/02/17 职场文书
简单实现一个手持弹幕功能+文字抖动特效
2021/03/31 HTML / CSS
MySQL常用慢查询分析工具详解
2022/08/14 MySQL
Python使用pandas导入csv文件内容的示例代码
2022/12/24 Python