Denny.NET

I can haz ASP.NET goodness?

About the author

Denny Ferrassoli
Developer at Casting Networks. MCP / .NET
E-mail me Send mail
Add to Technorati Favorites

Recent posts

Recent comments

Authors

Disclaimer

The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

© Copyright 2008

TypeWatch: jQuery Plugin

Earlier this week I created a jQuery plug-in that allows you to potentially determine when a user has finished typing in a textbox. I created it for a search textbox on one of my websites so that I could return results by firing some AJAX after they're done typing. It could help with an AJAX auto-complete implementation too.

[UPDATED 05/16/08]

There are 4 settings you can set:

1. callback: The function to callback after the user has "finished" typing. Default void.
2. wait: The number of milliseconds to wait before the plugin considers that typing has finished. Default 750.
3. highlight: Aesthetics, determines if the text should be highlighted when the textbox receives focus. Default true.
4. captureLength: The minimum amount of characters necessary before allowing the event to fire. Default 2.

How it works:

For each textbox or textarea matched through jQuery it creates a timer which gets reset upon every [KeyDown] event. If the timer's [wait] is reached then the user has finished typing, or stopped typing long enough for the timer to reach its [wait] interval.

The callback will not execute if the length of text is less than captureLength. Also, if the timer's [wait] interval is reached and the text has not changed it will not execute the callback. So if you change "some text" to "SOME TEXT" the callback will not execute. The callback will be executed when the ENTER key is pressed on single-line INPUT elements.

You can get the debug and packed version at: http://jquery.com/plugins/project/TypeWatch

The latest version 2.0.0 is a complete refactor of code and includes a few issue fixes. Code has been refactored thanks to Charles Christolini - BinaryPie.com

DEMO:

Click here for the Live Demo

Digg It!DZone It!StumbleUponTechnoratiRedditDel.icio.usNewsVineFurlBlinkList

Currently rated 3.8 by 34 people

  • Currently 3.823529/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Categories: Client-Side
Posted by Denny on Friday, August 17, 2007 10:23 AM
Permalink | Comments (52) | Post RSSRSS comment feed

Comments

julien-verkest.fr

Thursday, November 22, 2007 2:43 AM

pingback

Pingback from julien-verkest.fr

Julien Verkest » 240 plugins jQuery

propiedadprivada.com

Wednesday, December 05, 2007 4:38 AM

pingback

Pingback from propiedadprivada.com

Propiedad Privada » Blog Archive » 240 Plugins para jQuery

teo.com.br

Tuesday, January 01, 2008 3:38 AM

pingback

Pingback from teo.com.br

Diversos Links para desenvoledores de javascript | Blog do teo

v-campus.cn

Saturday, January 26, 2008 7:52 PM

pingback

Pingback from v-campus.cn

风筝博客

i-noova.com

Sunday, February 17, 2008 7:26 AM

pingback

Pingback from i-noova.com

Ressources pour le développement web et WordPress » i-noova*

blogdavid.freehostia.com

Monday, March 03, 2008 3:07 AM

pingback

Pingback from blogdavid.freehostia.com

Recursos y Tutoriales » Blog Archive » 240 plugins de jquery increible!!

riaeye.com

Sunday, March 09, 2008 10:30 PM

pingback

Pingback from riaeye.com

THE EYE OF RIA » jQuery 插件列表

kollermedia.at

Friday, March 14, 2008 4:38 AM

pingback

Pingback from kollermedia.at

The ultimate jQuery Plugin List | Kollermedia.at

blog.fj18.com

Sunday, March 16, 2008 11:30 PM

pingback

Pingback from blog.fj18.com

Grom’s home » Blog Archive » [转]240多个jQuery插件

xilo.cn

Thursday, March 27, 2008 8:56 PM

pingback

Pingback from xilo.cn

jQuey插件 | xilo's blog

mashuphowto.wordpress.com

Sunday, March 30, 2008 9:20 AM

pingback

Pingback from mashuphowto.wordpress.com

La boîte à outils du codeur de site Web « Mashuphowto’s Weblog

jcold.com

Tuesday, April 01, 2008 6:37 PM

pingback

Pingback from jcold.com

强烈推荐:240多个jQuery插件 at 备忘库-冷

volkansenturk.com

Wednesday, April 09, 2008 2:56 AM

pingback

Pingback from volkansenturk.com

240 adet jquery ekelntisi - Volkan Şentürk

css4design.com

Wednesday, April 23, 2008 9:19 AM

pingback

Pingback from css4design.com

» 1000 ressources pour le développement web et WordPress : la grosse grosse liste « css4design : des css pour votre design html

sapling.wordpress.com.cn

Monday, April 28, 2008 8:48 AM

pingback

Pingback from sapling.wordpress.com.cn

jQuery插件集合.(240) | Sapling soliloquize

net0951.com

Friday, May 02, 2008 9:32 PM

pingback

Pingback from net0951.com

强烈推荐:240多个jQuery插件 - 胡言乱语

sastgroup.com

Tuesday, May 13, 2008 11:33 AM

pingback

Pingback from sastgroup.com

sastgroup.com » Blog Archive » 240 plugins jquery

Denny us

Friday, May 16, 2008 2:03 PM

Denny

New version has many fixes Smile

Oktay Acikalin de

Friday, May 16, 2008 2:56 PM

Oktay Acikalin

thanks Smile
right now im writing a plugin-system for aurora and am building some packages. i'm putting it right in Smile.

blog.colomove.com

Friday, May 16, 2008 11:10 PM

pingback

Pingback from blog.colomove.com

240 plugins jquery | Computer and Technoloy News

JK

Wednesday, May 21, 2008 11:10 PM

JK

Is there a way to re-capture the previous timer object in the new version, so that it can be cleared externally?
It worked with the old version, where the timer is saved as window[this.typewatchid].
Is there a "better" way of doing so, without going back and add the old code into the new and better implementation?

Denny us

Friday, May 23, 2008 10:12 AM

Denny

Hey JK what is the purpose of clearing it externally?

Martin Pärtel fi

Monday, May 26, 2008 7:22 AM

Martin Pärtel

Hi,
Thanks for this nice plugin.

Two issues I noticed:
- I've seen references to an 'enterkey' and a 'captureEnter' option but they don't seem to be implemented.
- In the callback, I'd like to access the element being edited via 'this'. Right now I only get the text as the parameter.

Also, shouldn't the file be named jquery.typewatch.js for consistency with other jQuery plugins?

Thanks!

Denny us

Tuesday, May 27, 2008 11:40 PM

Denny

Hi Martin,
To address your issues:

1. captureEnter was removed in version 2. TypeWatch now always captures the enter key on single-line input elements.
2. That's a good idea! I won't have a fix up right now but if you want to make the change yourself you just need to edit one line in the javascript file:

In the checkElement function change
timer.cb(elTxt);
to
timer.cb.apply(timer.el, elTxt);

And I think that should do it.

I'll release the next version with the change and I will be modifying the name of the script to be consistent with the other plugins. Thanks for your time!

zhaipeng.cn

Wednesday, May 28, 2008 1:49 AM

pingback

Pingback from zhaipeng.cn

翟鹏的博客 » 240个JQuery插件

魔兽世界私服 cn

Friday, June 13, 2008 7:52 PM

魔兽世界私服

Thanks for your time!

clittle.cn

Saturday, June 14, 2008 7:47 AM

pingback

Pingback from clittle.cn

键盘人生 - 强烈推荐:240多个jQuery插件

blog.bloogs.cn

Friday, June 27, 2008 8:10 PM

pingback

Pingback from blog.bloogs.cn

经典240多个jQuery插件 | 喜羊羊与懒羊羊的窝

blox.svbasi.com

Saturday, June 28, 2008 7:27 AM

pingback

Pingback from blox.svbasi.com

Blox.Svbasi · 240 plugins jQuery

hiddenpixels.com

Monday, June 30, 2008 2:37 AM

pingback

Pingback from hiddenpixels.com

Hidden Pixels - JQuery Examples

jquerytips.com

Tuesday, July 01, 2008 9:57 AM

pingback

Pingback from jquerytips.com

jQueryTips » รวมฮิต jQuery Plugins มากกว่า 200 รายการ

elmanusito.wordpress.com

Thursday, July 31, 2008 1:46 PM

pingback

Pingback from elmanusito.wordpress.com

La mejor recopilación de plugin de JQuery « Elmanusito’s Weblog

spring.blog.35.com

Monday, August 04, 2008 2:38 AM

pingback

Pingback from spring.blog.35.com

jQuery插件列表 | WebRebuilder

t.api.li

Sunday, August 10, 2008 3:42 PM

pingback

Pingback from t.api.li

强烈推荐:240多个jQuery插件

mb120.com

Thursday, August 14, 2008 2:40 AM

pingback

Pingback from mb120.com

弹指神功 » Blog Archive » 240多个jQuery插件

parandroid.com

Wednesday, August 27, 2008 2:43 AM

pingback

Pingback from parandroid.com

200+ jQuery插件 | 帕兰映像

mariusdima.com

Saturday, September 06, 2008 4:17 PM

pingback

Pingback from mariusdima.com

240 Plugin List in jQuery | Marius Dima

wp.2nono.com

Monday, September 22, 2008 11:01 PM

pingback

Pingback from wp.2nono.com

200+ jQuery插件 | 浮世失焦

10lidi.com.cn

Monday, September 29, 2008 2:05 PM

pingback

Pingback from 10lidi.com.cn

多个jquery效果演示效果示例 - 虾米碗糕|十里地后院

simonedamico.it

Saturday, October 04, 2008 11:47 AM

pingback

Pingback from simonedamico.it

Simone D’Amico » Blog Archive » [jQuery] 240 plugins per jQuery

phper5.com

Tuesday, October 07, 2008 11:49 AM

pingback

Pingback from phper5.com

imagic’s blog » Blog Archive » JQUERY插件集合

birogrenciklasigi.com

Sunday, October 12, 2008 5:05 AM

pingback

Pingback from birogrenciklasigi.com

jQuery Eklentileri | Bir Öğrenci Klasiği

kevenking.cn

Tuesday, October 14, 2008 4:51 AM

pingback

Pingback from kevenking.cn

这个…..名字还没想好 -_-|| » 240多个jQuery插件

5.5sopo.cn

Friday, October 17, 2008 3:16 AM

pingback

Pingback from 5.5sopo.cn

Sopo天下 » Blog Archive » Jquery插件大全 - 修休养,成智者.行大道,方成者。

wbphp.cn

Tuesday, October 21, 2008 5:51 AM

pingback

Pingback from wbphp.cn

jQuery插件大汇总 | 中国洛阳php外包php网站建设外包php项目外包php网页设计外包服务商-牡丹网景

lohas0756.com

Wednesday, October 29, 2008 3:14 AM

pingback

Pingback from lohas0756.com

强烈推荐:240多个jQuery插件 | 好好学ä¹

my.nexe.ru

Friday, October 31, 2008 9:29 AM

pingback

Pingback from my.nexe.ru

240 удивительных плагинов для jQuery | Parinoff Life

giornale.fm

Friday, October 31, 2008 7:12 PM

pingback

Pingback from giornale.fm

Lista plugins jquery | Giornale blog Wordpress

adpub2.nimads.com

Wednesday, November 05, 2008 9:17 PM

pingback

Pingback from adpub2.nimads.com

nimads knowledge base » Blog Archive » 强烈推荐:240多个jQuery插件

c-peerless.com

Saturday, November 15, 2008 9:16 PM

pingback

Pingback from c-peerless.com

TECHONE BLOG-中一科技作品博客 » Blog Archive » 强烈推荐:240多个jQuery插件

54chen.com

Sunday, November 16, 2008 5:07 AM

pingback

Pingback from 54chen.com

Jquery的N个插件 | php技术交流|我是陈|54chen.com

centerofspotlight.com

Monday, November 17, 2008 8:33 PM

pingback

Pingback from centerofspotlight.com

240 plus Jquery plugins | Center Of Spotlight

Add comment


(Will show your Gravatar icon)  

  Country flag

biuquote
  • Comment
  • Preview
Loading