點擊5次後可以點擊按鈕嗎？

用戶單擊按鈕五次後，我希望按鈕被禁用。點擊5次後可以點擊按鈕嗎？

是否可以在HTML中做，或者我需要使用JavaScript？

來源

2017-06-18 Riz-waan

確實有可能得到所有值大於等於5的指數。但在你的情況下，可能有其他解決方案。你在哪裏改變數組值？你可以引入一個setter方法來改變給定索引處的數組值，同時如果值> 5，則禁用相應的按鈕。 –

首先你可以給每個按鈕一個data-clicks屬性。其中包含此按鈕的點擊次數。

每當用戶點擊任何按鈕，檢查data-clicks屬性值是否等於5.然後禁用該按鈕。否則只是增加存儲在data-clicks

例數

只能點擊5次爲每個按鈕，該按鈕將被禁用

let btns = document.querySelectorAll(".my-btn"), btn = null; 
 

 
for (let i = 0; i < btns.length; i += 1) { 
 
    btns[i].onclick = function() { 
 
    
 
     this.setAttribute('data-clicks', Number(this.getAttribute('data-clicks')) + 1) 
 
     
 
     if (this.getAttribute('data-clicks') === '5') { 
 
      this.setAttribute('disabled', 'disabled'); 
 
     } 
 
    } 
 
}

<input type="button" class="my-btn" value="button 1" data-clicks="0"> 
 
<input type="button" class="my-btn" value="button 2" data-clicks="0"> 
 
<input type="button" class="my-btn" value="button 3" data-clicks="0"> 
 
<input type="button" class="my-btn" value="button 4" data-clicks="0"> 
 
<input type="button" class="my-btn" value="button 5" data-clicks="0">

後

我刪除了數組，因爲不需要它。也沒有它會動態與你的HTML按鈕。你可以很容易地刪除或添加按鈕，未經任何編輯爲你的JavaScript代碼

UPDATE

您的jsfiddle可以嵌入我的代碼在你myno功能這樣https://jsfiddle.net/bhoLbu8x/5/

來源

2017-06-18 14:59:47

是這樣的：

而不是按鈕我放1,2,3,4因爲按鈕是以這種格式自動創建的

？ –

@raakobihai我更新它採取索引，而不是價值。你的依賴對我來說並不明確。 –

好吧，我在js中有一個代碼，每次人們按下按鈕時都會創建一個文本字段。按鈕標籤/名稱中沒有任何獨特的所有按鈕都是相同的。但是在按鈕id中，它從1開始遞增，例如，等等。每次單擊按鈕創建文本字段時，我都希望增加陣列相應位置的值。所以我的按鈕id =數組中的位置。這仍然適用於這個嗎？ –

希望這給你一些想法：

var h = [2, 4, 6, 3, 4, 2, 7]; 
var button = document.getElementsByTagName('button'); 
var placementOfValueReaches5 = []; 

h.forEach(function(value, index){ 
    if (value >= 5){ 
     button[index].setAttribute('disabled', true); 
     placementOfValueReaches5.push(index); 
    } 
}); 

console.log(placementOfValueReaches5); // outputs [2, 6]

更多關於Array.prototype.forEachhere的信息。

來源

2017-06-18 15:15:13

這是否也禁用了按鈕？ –

是的。 'button [index] .setAttribute（'disabled'，true）''行禁用了按鈕。 –

你對問題的修改徹底改變了問題和適當的解決方案 –

點擊5次後可以點擊按鈕嗎？

回答

相關問題