如何捲動使用輸入類型單選按鈕建立的清單?
P粉176151589
P粉176151589 2024-04-01 08:41:36
0
1
300

這是我的程式碼, 我希望當我向下或向上滾動時激活它們,而不是通過單擊它們

<input type="radio" name="buttons" id="r1" checked>    
<input type="radio" name="buttons" id="r2">    
<input type="radio" name="buttons" id="r3">    
<input type="radio" name="buttons" id="r4">   

<div class="controls">
    <label for="r1"><span></span>LAB & Process Development</label>
    <label for="r2"><span></span>Quality & Regulatory</label>
    <label for="r3"><span></span>Engineering & Project Management</label>
    <label for="r4"><span></span>EHS</label>
</div>

謝謝你幫我

P粉176151589
P粉176151589

全部回覆(1)
P粉674876385

我不太明白你想要實現什麼。

但是,如果您想在捲動上執行任何操作,則應該監聽滾動事件。 您有兩個選擇:

  1. 您可以檢查使用者何時在收音機上滾動滑鼠
  2. 您可以隨時檢查使用者何時捲動

第一種情況:

document.getElementById('controls').addEventListener('scroll', () => {
    //activate your element
});

第二種情況:

document.addEventListener('scroll', () => {
    //activate your element
});

編輯:依照評論中的要求。 這取決於您想如何實現這一目標。例如,您可能想要透過循環檢查每個無線電:

let current = 1;
let max = 4;

document.addEventListener('scroll', () => {
    //you need to uncheck the current one first
    document.getElementById('r' + current).checked = false;
    //If you reach the last radio element you reset the counter
    if(current == max) 
        current = 1;
    else
        current += 1;

    //Finally you activate the next radio
    document.getElementById('r' + current).checked = true;
});

這是一個非常簡單的實現,可以改進。

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!