執行按住按鈕

感謝您對之前（由主持人刪除）的解釋和簡單的實現，但它不適用於我。 'holdit'函數可以工作，但不是不穩定，可能是因爲'holdit'函數中有'onmouseup'，即使我禁用了HTML按鈕上的onmouseup，它也不是很穩定。也許最好使用addEventListener- onmousedown-interval函數，但我不知道如何以最簡單的方式實現它。這是完整的功能，顯示一個按下的按鈕，並增加timeSeconds變量一。爲了安全起見，數量在限制範圍內。請幫忙。執行按住按鈕

 HTML: 
    <img id="but4" class="button" src= "//:0" onmousedown="timesecPlus();"onmouseup="timesecPlsUp();"/> 

    JAVASCRIPT: 
    function timesecPlus() { 
    var pmknop = document.getElementById('but5'); 
    pmknop.src = secminBtndwn; //inline Base64 data: button image down (pressed) 

    timeSeconds = ((timeSeconds>wedstrijdperiode.seconden-6)?(timeSeconds):(++timeSeconds)); //You can ++ chase-back the timeseconds until 5 sec's from period start-time 
    displayTime(timeSeconds); 
    }; 

    function timesecPlsUp() { 
    var pmknop = document.getElementById('but5'); 
    pmknop.src = secminBtn; //inline Base64 data: button image up (normal) 
    }; 

    // Things I tried: 
    //holdit(pmknop, function() { ++timeSeconds ; displayTime(timeSeconds);}, 2000, 2); 
    //pmknop = pmknop.addEventListener('mousedown', function() { interval = setInterval(timesecPlus(), 2000); }); 


    function holdit(btn, action, start, speedup) { 
    var t; 

    var repeat = function() { 
    action(); 
    t = setTimeout(repeat, start); 
    start = start/speedup; 
    } 
    btn.onmousedown = function() { 
    repeat(); 
    } 
    btn.onmouseup = function() { 
    clearTimeout(t); 
    } 
    };

來源

2017-06-13 dikkehenk

btn是你想點擊的按鈕或其他html元素例如：'document.getElementById（'myButton'）;'動作是按下按鈕時重複的函數。例如：'function（）{console.log（'我的按鈕被點擊'）}'。啓動並加速我簡單 – guest

在'mousedown'上設置超時並在'mouseup'上清除 –

簡單實現：

var btn = document.getElementsByClassName('button')[0]; 
holdit(btn, function() { timeSeconds++ ; displayTime(timeSeconds);}, 1000, 2);

實現無holdit：

var btn = document.getElementsByClassName('button')[0]; 
var couterFunc, couter=0; 
btn.addEventListener('mousedown',function(){couterFunc = setInterval(update,1000); update()}) 
btn.addEventListener('mouseup',function(){clearInterval(couterFunc)}) 

/* function that will fire when button press*/ 
function update(){console.log(++couter)};

來源

2017-06-13 14:47:32 guest

我嘗試了上面的答案和簡單的實現，但'holdit'函數不是很穩定。也許最好是延遲'重複按鈕'。 https://edsilverton.wordpress.com/2011/04/11/how-to-make-a-repeating-button-with-delay-in-jquery/上有一個美麗的解決方案，但這是在JQuery中，我不能使用它。希望能夠以簡單的Javascript使用。我也編輯了完整的代碼。 – dikkehenk

現在添加的解決方案沒有holdit功能;） – guest

試過這一個（沒有holdit函數），但是當我按住按鈕什麼也沒有發生。當我重複點擊它需要很大的步驟減少時間Second var。是否有可能將Ed Silverton的'重複按鈕延遲'從JQuery轉換爲純Javascript。這正是我需要的。謝謝 – dikkehenk

的holdit功能正在採取四個變量。第一個：btn，是按鈕ID。這用於確定單擊鼠標時執行的操作。

第二個變量是對函數的引用。它被稱爲回調函數，因爲只要你調用holdit，你就會傳遞一個函數Caaalleed。

最後兩個變量只是簡單地決定延遲執行重複的時間和延遲時間，以及每次重複會加快多少。

var repeat = function() { 
    action(); 
    t = setTimeout(repeat, start); 
    start = start/speedup; 
}

重複是一個遞歸函數，它將在'開始'毫秒後調用，並在每次迭代後更頻繁地重複。

來源

2017-06-13 14:57:35

執行按住按鈕

回答

相關問題