如何在每次字符串迭代後調用回調函數？

我使用jQuery libary類型，它在這裏找到：http://macarthur.me/typeit/docs/如何在每次字符串迭代後調用回調函數？

這裏是我的代碼

$('.type-it').typeIt({ 
     strings: ['Text 1','Text 2'], 
     speed: 110, 
     breakLines: false, 
     callback: function() { $('.type-it').css('background-color', '#EFC137').delay(1000).queue(function() {$('.type-it').empty() }) } 
    }) 
    .tiPause(1000);

我想要做的就是運行的回調函數，每個字符串類型，而不是之後畢竟字符串鍵入。

任何想法？

在此先感謝。

來源

2017-04-04 Jamie O' Connell

https://jsfiddle.net/pj3frgtt/ –

回調函數不是從每次迭代觸發我覺得從該庫和它不提供返回的值，則需要請使用[MutationObserver]示例（https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver） – Roljhon

但我希望它在每次迭代後都能運行。 –

如果庫不支持它，我們可以將單個字符串傳遞給該函數。這是一個黑客做到這一點。

$(document).ready(function() { 
 
    var ara = ['Text 1', 'Text 2'].reverse(); 
 
    doType(); 
 

 
    function doType() { 
 
    var x = ara.pop(); 
 
    $('.type-it').typeIt({ 
 
     strings: [x], 
 
     speed: 110, 
 
     breakLines: false, 
 
     callback: function() { 
 
     $('.type-it').css('background-color', '#EFC137').delay(2000).queue(function() { 
 
      $('.type-it').empty(); 
 
      $('.type-it').css('background-color', 'transparent'); 
 
      if (ara.length > 0) 
 
      doType(); 
 
     }) 
 
     } 
 
    }); 
 
    } 
 
});

.type-it { 
 
    transition: all 0.5s ease-in-out; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.jsdelivr.net/jquery.typeit/4.4.0/typeit.min.js"></script> 
 
<div class="type-it"></div>

來源

2017-04-05 04:49:56

這與我想要的很接近。想要我想要發生的是要鍵入一個字符串，然後跨度背景顏色更改爲黃色，然後刪除。然後我想要輸入下一個字符串，然後執行相同的操作。 –

好的..我會做的。 –

好的，真棒謝謝！ –

如何在每次字符串迭代後調用回調函數？

回答

相關問題