zoukankan      html  css  js  c++  java
  • js模拟打字效果

      $(function () {
    
    
                var input_type = {
                    init:function ($obj) {
                        this.name = $obj.html().split("")
                        this.length = this.name.length;
                        this.i = 0;
                    },
                    pri:function () {
                        var $this = this
                        //在此处只能使用闭包,因为windown.settimeout使函数的this指向object windown,而非原型链的this对象。而此时我需要递归,所以只能将this对象传到闭包内,递归匿名的闭包函数。
                        return (function () {
                            if ($this.i > $this.length) {
                                window.clearTimeout(Go)
                                return false;
                            }
                            var char = $this.name
                            $(".div1").append(char[$this.i])
                            $this.i++
                            var Go = window.setTimeout(arguments.callee, 100)//在这里arguments.callee妙用因为是匿名闭包,调用函数本身。
                        })
                    }
                }
    
    
    //建立class类
                function Input_type() {
                    this.init.apply(this, arguments)
                }
    
                Input_type.prototype = input_type
    
    //创建实例
                var p = new Input_type($(".content"))
                p.pri()()
    
            });
    

     总结:为了实现每次循环间隔时间,用window.settimeout递归的写法。 因为想用原型链封装,this冲突,所以递归调用匿名的闭包函数。用arguments.callee表示匿名函数。

    demo:

  • 相关阅读:
    PV、UV、GMV
    保存Hive查询结果的方法 insert overwrite 用法
    Hive substr 函数截取字符串
    HIVE中join、semi join、outer join
    Hive 差集运算
    gitlab和github区别
    前端工程化 ESlint 配置
    ES6 WeakMap Map 区别
    js 创建数组方法以及区别
    eslint for...in 报错处理
  • 原文地址:https://www.cnblogs.com/breakdown/p/2696716.html
Copyright © 2011-2022 走看看