希望一次只回傳一個專案,并在本地存盤中的陣列上回圈,目前我已經用 css 構建了一個選取框來模擬滾動影片。目標是以僅回傳一個元素的方式回圈,然后在第二個回圈中回傳第二個元素,依此類推。這可以通過 setInterval 或 setTimeout 實作嗎?索引在延遲或超時之間回圈在哪里?
是否可以使用 for 回圈來做到這一點?還是我應該使用其他東西?我特別需要顯示的第一個專案,然后是第二個專案,并且似乎無法正確表達它以找到
我嘗試使用 Queue 類的答案,但似乎也無法讓它作業。這是我能想出的最接近的作業示例。
下面的 Gif 示例
代碼
const marqueeMonthlies = () => {
insertMarquee.empty();
let marqueeMonthlyPlates = JSON.parse(localStorage.getItem('Monthly Plates'));
for (i = 0; i < marqueeMonthlyPlates.length; i ) {
insertMarquee.append(`
<div id="generatedMonthlyPlates">
<input type="text" width="100px" name="monthlyLicensePlate" id="${marqueeMonthlyPlates[i]}" placeholder="AB12345" value="${marqueeMonthlyPlates[i]}"/>
</div>
`)
}
}
startMonthlies.click((event) => {
event.preventDefault();
setInterval(marqueeMonthlies(),1000);
})
最好的方法是什么?
有人提到使用生成器函式,但我不知道在這種情況下這對我有什么幫助,因為我需要將每個結果作為單個車牌回傳,而不是它們的組。
uj5u.com熱心網友回復:
我對這個問題的理解是,您需要一種方法來“保存”某些資料陣列的索引,以便在下一次定時更改發生時它可以遞增。
我準備了一個示例來說明如何實作這一點,以適應您的特定需求。
首先,setInterval(在我的示例中,通過按下按鈕開始)定義何時進行更改。
要執行的程序被放置在setInterval呼叫的函式引數中。在我的示例中,這僅涉及在頁面上顯示陣列元素的字串內容。
重要的一點是該陣列由在全域范圍內定義但從函式內部遞增的數字索引參考。因此,在間隔的每個周期中,讀取的索引都比上一個多一個。
為了處理越界錯誤(如果索引大于陣列的長度,則會發生這種情況),索引會受到陣列長度的剩余除法,使用index %= content.length使得在陣列末尾增加索引,重置它為 0 以在陣列的開頭繼續。
被分配給一個變數,以便在要停止回圈程序時setInterval可以參考它。clearInterval
因為索引是一個全域變數,如果間隔被取消,它的值仍然存在,所以如果再次設定間隔,索引將是回圈停止的值,所以效果是從發生暫停的地方繼續(而不是每次回圈恢復時從第一個元素開始)。
setInterval可以修改內部的函式以處理所需的任何資料,相關位是它保留了遞增索引值的記憶體。
作業片段:
const display = document.getElementById("output");
const content = ["cat", "dog", "rabbit", "goldfish", "tortoise", "pony", "chicken"];
let intervalId;
let index=0;
function cycleContent (){
intervalId = setInterval(() => {
index %= content.length
display.innerText = content[index];
index ;
},1000);
} // end cycleContent function;
div {
height: 1.2em;
}
<p><button onclick="cycleContent()">start</button></p>
<div id="output"> </div>
<p><button onclick="clearInterval(intervalId)">stop</button></p>
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/461272.html
標籤:javascript jQuery for循环 选框
上一篇:設定被讀取為變數的當前檔案的名稱
