jquery通过扩展select控件实现支持enter或focus选择的方法
更新时间:2015年11月19日 11:00:35 作者:jdkleo
这篇文章主要介绍了jquery通过扩展select控件实现支持enter或focus选择的方法,通过jQuery针对select空间增加enter及focus选择功能分析了jQuery扩展的相关实现技巧,需要的朋友可以参考下
本文实例讲述了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程序设计有所帮助。
相关文章
jQuery实现下拉框多选 jquery-multiselect 的实例代码
这篇文章主要介绍了jQuery实现下拉框多选 jquery-multiselect 的实例代码,非常不错,具有参考借鉴价值,需要的朋友可以参考下2016-07-07
JqueryMobile动态生成listView并实现刷新的两种方法
本篇文章主要是对JqueryMobile动态生成listView并实现刷新的两种方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助2014-03-03
bootstrapValidator表单校验、更改状态、新增、移除校验字段的实例代码
这篇文章主要介绍了bootstrapValidator表单校验、更改状态、新增、移除校验字段,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-05-05
jQuery+Ajax+js实现请求json格式数据并渲染到html页面操作示例
这篇文章主要介绍了jQuery+Ajax+js实现请求json格式数据并渲染到html页面操作,结合实例形式分析了jQuery+Ajax请求json格式数据并渲染到html页面相关步骤与操作技巧,需要的朋友可以参考下2020-06-06


最新评论