jQuery每个-如何构建方法链接?

时间:2018-06-20 20:25:12

标签: javascript jquery

我想知道是否有可能使用jQuery $ .each或类似的东西动态地为一个对象链接方法

我的功能现在看起来像这样。我解析一个字符串数组,并传递给typewriter.js脚本

  function initTypewriter(){
    if ( $('[js-typewriter]').length > 0 ){
      $('[js-typewriter]').each(function(i,el){
        var typewriter = new Typewriter(el, {
          loop: true
        });
        var strings = $(el).data("type").split(';');

        typewriter
          .typeString(strings[0])
          .pauseFor(2000)
          .deleteAll()
          .typeString(strings[1])
          .pauseFor(2000)
          .deleteAll()
          .typeString(strings[2])
          .pauseFor(2000)
          .start();

      })
    }
  }

问题在于,数组中可能有10或20个字符串。所以我很想用类似...

的代码来干燥我的代码。
    $.each(strings, function(i,str){
      // hot to add to chain of typewriter instance ?? 
      .typeString(str)
      .pauseFor(2000)
      .deleteAll()
    })

..所以我不应该重复20次

1 个答案:

答案 0 :(得分:2)

我不确定您使用的是哪个库,但这应该可以工作:

var chained = typewriter;
$.each(strings, function(i,str){
  chained = chained
  .typeString(str)
  .pauseFor(2000)
  .deleteAll();
});
chained.start();

大多数使用链接的功能在每次调用后都会返回实例。通过在链接后为实例设置变量来利用这一点,就意味着您总是在实例上添加了最新的链接函数。

您可以只使用typewriter而不是chained -引入了该变量以使链接方面更清晰。