依据jquery的抉择标签至文本域效果【金沙8331网址】

暂时没有对手动输入的做判断, 需要的话,
可自行在keyup及change事件中添加相关判断.
相关说明及调用方法,请参见代码中的注释. 演示及代码:

选择标签至文本域效果,可多选/可过滤重复/可限制个数@Mr.Think

标签: 关闭

温馨提示:选择下面的热门标签及使用过的标签,标签将自动排列至表单域。

热门标签:时光漫步JavaScriptjQuery
Plugin那一年jQuery插件简单星空梦田晴朗mrthink.net

您使用过的标签:许巍Sophie
Zelmani王菲小娟&山谷里的居民Ke$HaShakira朴树罗大佑

我是用来测试的下拉列表 00 00 00 我是用来测试的下拉列表 one two three

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]金沙8331网址,复制代码 代码如下: ;{ $.fn.extend({
iSelectTags:function{ var iset={ name:’.tagsbox’,//表单或class或id名
drop:$,//弹出框定位 pseudoClass:$,//可选择的标签定位
close:$,//关闭按钮定位 separator:’,’,//标签间分隔符,建议使用英文逗号
maxCount:10 //默认限制个数,也可以设置表单的data-count值覆盖默认值 }
options = options || {}; $.extend; var _input=$; var
_inputVal=_input.val(); var _arr=new Array(); //存放标签的数组 var
_left=_input.offset().left; //左绝对距离 var
_top=_input.offset().top+_input.outerHeight();
//上绝对距离,此处要加上表单的高度 var
_dropW=_input.outerWidth()-parseInt(_input.css-parseInt(_input.css)-parseInt(iset.drop.css-parseInt(iset.drop.css;
iset.drop.css({‘position’:’absolute’,’left’:_left+’px’,’top’:_top+’px’,’width’:_dropW+’px’});
//弹出框的宽度,此处计算的是与表单实际宽度相等的.也可以直接在样式中定义.
var _txt=null; var _maxCount=parseInt(_input.attr;//限制选择个数 if{
_maxCount=iset.maxCount } _input.click{ iset.drop.show();
iset.drop.bgiframe();//调用bgiframe插件,解决ie6下select的z-index无限大问题
}).bind(‘keyup change’,function(){
//可以在此处扩展手动输入标签情况下的相关判断
//if语句可避免清空重新选择时第一个字符为逗号 if { _arr = new Array();
}else { _arr = $.split;//当用户手动删除或修改标签值后更新标签值 } });
$.click{ //点击非弹出框区域时关闭弹出框 //下面的
if语句是用来判断传入的是class还是id if==’#’){
if(e.target.id!=iset.name.substring; } }else if==’.’){
if(e.target.className!=iset.name.substring; } } }); iset.drop.click{
//阻止弹出框区域默认事件 e.stopPropagation; iset.pseudoClass.click{
//标签选择 _txt=$; //下面的$.inArray是用来判断是否重复
//若想反馈重复提示或走出限制个数提示,可改进下面的if语句 if==-1) &&
(_arr.length<_maxcount _arr.push=”” _inputval=”_arr.join;”
_input.val=”” iset.close.click=”” iset.drop.hide=””/>

发表评论

电子邮件地址不会被公开。 必填项已用*标注