如何檢查我的Jquery函數是否成功完成？

Question

我正在做jquery函數來對文本段落做一些動畫，我在Stackoverflow中找到了一個很好的例子，並對其進行了編輯以滿足我的需求。

但是如何在最後一段動畫完成後提醒某些事情？

你可以檢查我的代碼形式下面的鏈接

http://jsbin.com/araget/24/edit

(function ($) { 
    // writes the string 
    // 
    // @param jQuery $target 
    // @param String str 
    // @param Numeric cursor 
    // @param Numeric delay 
    // @param Function cb 
    // @return void 
    function typeString($target, str, cursor, delay, cb) { 
    $target.html(function (_, html) { 
     return html + str[cursor]; 
    }); 

    if (cursor < str.length - 1) { 
     setTimeout(function() { 
     typeString($target, str, cursor + 1, delay, cb); 
     }, delay); 
    } 
    else { 
     cb(); 
    } 
    } 

    // clears the string 
    // 
    // @param jQuery $target 
    // @param Numeric delay 
    // @param Function cb 
    // @return void 
    function deleteString($target, delay, cb) { 
    var length; 

    $target.html(function (_, html) { 
     length = html.length; 
     return html.substr(0, length - 300); 
    }); 

    if (length > 1) { 
     setTimeout(function() { 
     deleteString($target, delay, cb); 
     }, delay); 
    } 
    else { 
     cb(); 
    } 
    } 

    // jQuery hook 
    $.fn.extend({ 
    teletype: function (opts) { 
     var settings = $.extend({}, $.teletype.defaults, opts); 

     return $(this).each(function() { 
     (function loop($tar, idx) { 
      // type 
      typeString($tar, settings.text[idx], 0, settings.delay, function() { 
      // delete 
      setTimeout(function() { 
       deleteString($tar, settings.delay, function() { 
       loop($tar, (idx + 1) % settings.text.length); 
       }); 
      }, settings.pause); 
      }); 

     }($(this), 0)); 
     }); 
    } 
    }); 

    // plugin defaults 
    $.extend({ 
    teletype: { 
     defaults: { 
     delay: 100, 
     pause: 5000, 
     text: [] 
     } 
    } 
    }); 
}(jQuery)); 

$('#target').teletype({ 
    text: [ 
    'Hi I am ShoBingg!', 
    'A Mobile loyalty system that works on your smart phone.', 
    'My job is to collect Binggz and redeem it for you so you get awarded!', 
    'So what are Binggz?', 
    'Binggz are the points you get from your favorite local merchants whenever you shop, dine or even visit!', 
    'So you do not have to carry any more cards, I am with you all the time and work with home deliveries and wherever you go.', 
    'Happy Rewarding!' 
    ] 
}); 

$('#cursor').teletype({ 
    text: ['_', ' '], 
    delay: 0, 
    pause: 500 
}); 

Answer 1

您可以添加其他選項，你的插件，是在事件的回調，該電傳即將循環。例如。如果選項被稱爲loopCallback，這個例子通過包含警報的功能callWhenFinished：

(function ($) { 
    // writes the string 
    // 
    // @param jQuery $target 
    // @param String str 
    // @param Numeric cursor 
    // @param Numeric delay 
    // @param Function cb 
    // @return void 
    function typeString($target, str, cursor, delay, cb) { 
    $target.html(function (_, html) { 
     return html + str[cursor]; 
    }); 

    if (cursor < str.length - 1) { 
     setTimeout(function() { 
     typeString($target, str, cursor + 1, delay, cb); 
     }, delay); 
    } 
    else { 
     cb(); 
    } 
    } 

    // clears the string 
    // 
    // @param jQuery $target 
    // @param Numeric delay 
    // @param Function cb 
    // @return void 
    function deleteString($target, delay, cb) { 
    var length; 

    $target.html(function (_, html) { 
     length = html.length; 
     return html.substr(0, length - 300); 
    }); 

    if (length > 1) { 
     setTimeout(function() { 
     deleteString($target, delay, cb); 
     }, delay); 
    } 
    else { 
     cb(); 
    } 
    } 

    // jQuery hook 
    $.fn.extend({ 
    teletype: function (opts) { 
     var settings = $.extend({}, $.teletype.defaults, opts); 
     var numOfMessages = settings.text.length; 

     return $(this).each(function() { 
     (function loop($tar, idx) { 
      // type 
      typeString($tar, settings.text[idx], 0, settings.delay, function() { 
      // delete 
      if ((idx+1) % numOfMessages === 0) 
       settings.loopCallback();  
      setTimeout(function() { 
       deleteString($tar, settings.delay, function() { 
       loop($tar, (idx + 1) % settings.text.length); 
       }); 
      }, settings.pause); 
      }); 

     } ($(this), 0)); 
     }); 
    } 
    }); 

    // plugin defaults 
    $.extend({ 
    teletype: { 
     defaults: { 
     delay: 100, 
     pause: 5000, 
     text: [], 
     loopCallback: callWhenFinished 
     } 
    } 
    }); 
}(jQuery)); 

$('#target').teletype({ 
    text: [ 
    '<a href="a">Hi I am ShoBingg!</a>', 
    'Happy Rewarding!' 
    ] 
}); 

function callWhenFinished() { 
     alert("Finished. Looping..."); 
}