分享一个自己做的用于文本插入的jquery插件

    这篇文章是我在自己博客上面比较早的一篇文章,做了一个适合自己用的Jquery插件,展示方式有点像JqueryUI中的日历插件,不过功能不同。原文地址:http://www.youguanbumen.net/Article.aspx?id=48

    以下是内容: 

 

    这个插件用起来的效果大致如下:用jquery选择器选中文本框或者文本域,然后调用插件提供的jquery扩展方法,传入一个json参数给这个方法(jquery插件都这样传参的),之后这个(这些)文本框或文本域获取到焦点的时候就会弹出一个东东,这个你设定好的文本数组(json参数中的一个参数),你可以点击其中一个文本,接着这个文本就会插入到文本框或者文本域中光标所在位置的后面...... - -! 截图大致如下,感觉有点像jquery ui里面的日历插件,当然要弱很多很多:

    因为是根据自己的需要来做的,所以扩展性和适用性相当一般,不过自己用感觉还是挺不错的,估计会有bug,目前在ie6~8还有firefox以及chrom中测试感觉都没问题,当然ie6和7可能会比较不要脸,你懂的(鼠标悬浮的效果是故意不支持ie6的哈)。下面是下载链接,欢迎下载使用。

        用力点击下载吧,Jquery.Careter.rar。PS:勇敢的少年请选用股沟浏览器,享受圆角的快感和流程的动画~~~

———————————————————— 更新的分割线 2010年12月11日 21:05:48 ————————————————————

    有朋友建议说弄成文本框失去焦点的时候就把弹出来的那个块给去掉,的确这个功能是必须的,于是做了点修改,在传入的参数里面加多了一个属性,是一个json,该json有三个属性,分别用于定义失去焦点的时候是否关闭弹出块(默认true)、点击插入项时是否关闭弹出块(默认false)、是否显示关闭按钮(默认true)。有了这三个参数就可以做出多种组合鸟。
    在实现失去焦点的时候关闭弹出块这个功能的时候遇到鸟麻烦,一开始以给文本框(也就是被扩展的对象)加个失去焦点的事件就行,理论上是对的,但事实上没有那么简单,里面涉及到事件冒泡、焦点不在文本框但是鼠标在弹出块区域时候的特殊处理、鼠标点击到其他也使用了这个插件的文本框或者其他的弹出块时候的特殊处理,在逼到走投无路的时候使用了jquery的缓存功能,总之就是吃了没文化的亏,现在看来这些问题都解决了,功能也和预料的一样。验证魔鬼藏在细节处这句话。
    另外,修改了两个功能上的缺陷,一个是现在每次弹出那个块都重新去算出现的位置,因为考虑到文本框的位置很有可能是会改变的;还有就是之前用到了jquery的新方法,这样做就兼容不了之前的版本了,这不是一件好事,现在也改过来了。实在很抱歉啊~~~
    好了,如果需要新版本的话请用力点击下载吧^_^,Jquery.Careter.rar。如果发现有不对劲的地方请告诉我哇!

posted @ 2010-12-26 21:49  serafin  阅读(825)  评论(2编辑  收藏  举报