基于jQuery编写的页面跳转简单的小插件

浏览数：26 / 时间：2015年06月09日

　　其实这个很简单，就是一个脚本函数和两个参数（url,jupetime）,

　　开始实现步骤：

　　　　1.像页面引用一个jquery工具包

　　　　2.在javascript脚本编写自定义方法：

　　　　　　　方法声明：

　　　　　　　$.extend({

　　　　　　　　meMethod:function();

　　　　　　　});

　　　　　方法调用：

　　　　　　　$.meMethod();

　　3.具体实现脚本代码：

 1 <script type="text/javascript">
 2         $(function () {
 3             $.extend({
 4                 pageJupe: function (tim, url) {
 5                         //创建节点
 6                         var di = $("<div  style=‘width:200px; height:100px; background-color:#dbd2d2;text-align:center;line-height:80px; position:absolute; top:45%; left:45%;‘><p>页面将在<span id=‘time‘ style=‘color:red;font-size:25px;‘>" + tim + "</span>秒后自动跳转</p></div>");
 7                         $(‘body‘).append(di);
 8                         var ding = setInterval(function () {
 9                         tim--;
10                         $(‘#time‘).html(tim);
11                         if (tim == 0) {
12                             clearTimeout(ding); //清空定时器
13                             di.remove();    //删除节点
14                             window.location =url;   //跳转页面
15                         }
16                     }, 1000);
17                 }
18            });
19         });
20 </script>