码迷,mamicode.com
首页 > Web开发 > 详细

jQuery延时插件doTimeout

时间:2014-10-14 19:15:59      阅读:270      评论:0      收藏:0      [点我收藏+]

标签:jquery   ui   web前端   前端   框架   

在很多的具体应用中都需要使用事件延迟触发,具体实现上使用setTimeout 函数,但使用还是有很多的不方便,所以这里介绍一个jQuery插件doTimeout,这个插件可以实现setTimeout 一样的效果,而且使用简单,同时可以在timeout运行之前可强制执行回调函数等。支持jQuery的链式调用。
使用实例
一,包含文件部分 精心开发5年的UI前端框架!
  1. <script type="text/javascript" src="http://banu.blog.163.com/blog/jquery.JS"></script>

  2. <script type="text/javascript" src="http://banu.blog.163.com/blog/jquery.do-timeout.js"></script>

二,HTML部分

<p id="text-input">biuuu.com</p> 
   
<form action=''> 
   
<input type="text" name="whatever"> 
   
</form>
 

     

三,Javascript部分 精心开发5年的UI前端框架!

$(function(){ 
   
    var default_text = $('p.textfield').text(); 
   
    $('form input').keyup(function(){ 
   
        $(this).doTimeout( 'typing', 250, function(){ 
   
            $('#text-input').text( $(this).val() || default_text ); 
   
        }); 
   
    }); 
   
});
 

 

 

如上实例,实现了一个延迟触发键盘keyup事件的功能,并把当前输入的字符显示在ID为text-input的DIV层中。

具体的应用可查看doTimeout的JS库文件,轻松实现个性化的事件延迟触发功能。

jQuery延时插件doTimeout

标签:jquery   ui   web前端   前端   框架   

原文地址:http://blog.csdn.net/ariss123/article/details/40078271

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!