如何使用if語句啓用按鈕？

Question

<script> 
    var tic; 
    tic = 0; 
</script> 

<script> 
    var ongngic; 
    ongngic = 1; 
</script> 

<button onclick="alert(tic=tic+ongngic);">Ice Cream</button> 
<button id= "b1" onclick="alert(ongngic=ongngic+1, tic=tic-10);" disabled="disabled">Buy 'Jimmy's Ice Cream Stand' - 10 Ice Cream</button> 

<script> 
    function myFunction() { 
     document.getElementById("b1").enabled = true; 
    } 
</script> 

<script> 
    if(var tic > 9){ 
     myFunction(); 
    } 
</script> 

當我點擊'冰淇淋'按鈕10次，id = 1按鈕應該啓用，但不。誰能幫我？

Answer 1

我希望這有助於 - 地方myFunction()中 -

onclick="alert(tic=tic+ongngic); myFunction()">Ice Cream</button> 

和myFunction()添加此之下線 -

document.getElementById("b1").disabled = false; 

所以如果要啓用該按鈕，你應該設置.disabled財產false 。

Answer 2

你的代碼有幾個問題。

首先刪除if語句中的var，然後再聲明變量。

當頁面加載時，腳本標記中的代碼正在運行，並且if語句因此只檢查一次。每次點擊按鈕時運行一個函數。

<button onclick="iceCreamButton();">Ice Cream</button> 

function iceCreamButton(){ 
    alert(tic=tic+ongngic); 

    if(tic > 9){ 
     myFunction(); 
    } 
} 

也在裏面myFunction的代碼是不正確改成這樣：

document.getElementById("b1").disabled = false; 

Answer 3

檢查這個代碼

<script> 
    var tic; 
    tic = 0; 
</script> 

<script> 
    var ongngic; 
    ongngic = 1; 
</script> 


<button onclick="clickFun();">Ice Cream</button> 
<button id= "b1" onclick="alert(ongngic=ongngic+1, tic=tic-10);" disabled="disabled">Buy 'Jimmy's Ice Cream Stand' - 10 Ice Cream</button> 

<script> 
    function myFunction() {  
     document.getElementById("b1").disabled = false; 
    } 
</script> 

<script> 
function clickFun(){ 
     tic+=ongngic; 
     alert(tic); 
     if(tic > 9){ 
      myFunction(); 
     } 
    } 

Answer 4

var tic; 
 
    tic = 0; 
 

 
    var ongngic; 
 
    ongngic = 1; 
 
     
 
    function myFunction() { 
 
     document.getElementById("b1").disabled = false; 
 
    } 
 
      
 
    function cal(){ 
 
     tic=tic+ongngic; 
 
     alert(tic); 
 
     if(tic > 9){ 
 
      myFunction(); 
 
     } 
 
    }

<button onclick="cal()">Ice Cream</button> 
 
<button id= "b1" onclick="alert(ongngic=ongngic+1, tic=tic-10);" disabled="disabled">Buy 'Jimmy's Ice Cream Stand' - 10 Ice Cream</button> 
 

 

Answer 5

有幾個代碼中的問題（一些被其他人提到的），我更喜歡使用jQuery對付DOM，但是當你在寫pure JavaScript你的代碼，我沒有使用jQuery我的代碼。對於很多原因，你應該避免inline JS，基本上不與JS儘可能混合HTML。你可以在這裏找到SO有關有用的信息：onclick=「」 vs event handler

如果你不熟悉addEventListener，這裏是很好的開始瞭解的是：EventTarget.addEventListener()

HTML

<button id="toggle">Ice Cream</button> 
<button id="target" disabled="disabled">Buy 'Jimmy's Ice Cream Stand' - 10 Ice Cream</button> 

JS

var toggle = document.getElementById('toggle'), 
    target = document.getElementById('target'), 
    tic = 0, 
    ongngic = 1, 
    myFunction = function() { 
     target.removeAttribute('disabled'); 
    }; 

toggle.addEventListener('click', function() { 
    tic = tic + ongngic; 
    console.log(tic); 
    // alert(tic); 

    if (tic > 9) myFunction(); 
}, false); 

target.addEventListener('click', function() { 
    ongngic = ongngic + 1; 
    tic = tic - 10; 

    var msg = 'tic:' + tic + ', ongngic: ' + ongngic; 
    console.log(msg); 
    // alert(msg); 
}, false); 

jsfiddle

Answer 6

從我瞭解你正在試圖做的，你需要爲檢查不同的東西兩個按鈕點擊事件監聽器。

點擊時會增加它自己的櫃檯，並啓用「冰淇淋站」按鈕，當它擊中10「冰淇淋」按鈕。點擊時的「冰淇淋站」按鈕會將「冰淇淋」計數器降低10點，並將其自身的計數器增加1點。如果「冰淇淋」計數器最終低於10點，它也會自動禁用。

var count_ice_cream = 0; 
 
var count_ice_cream_stands = 0; 
 

 
$('btn_ice_cream').addEventListener("click", function(e) { 
 
    count_ice_cream++; 
 

 
    if (count_ice_cream > 9) { 
 
    $('btn_ice_cream_stands').disabled = false; 
 
    } 
 

 
    update_totals(); 
 
}); 
 

 
$('btn_ice_cream_stands').addEventListener("click", function(e) { 
 
    count_ice_cream_stands++; 
 
    count_ice_cream = (count_ice_cream - 10); 
 

 
    $('btn_ice_cream_stands').disabled = !(count_ice_cream >= 10); 
 

 
    update_totals(); 
 
}); 
 

 
function update_totals() { 
 
    $('count_ice_cream').innerHTML = count_ice_cream; 
 
    $('count_ice_cream_stands').innerHTML = count_ice_cream_stands; 
 
} 
 

 
// Shh, don't use this in production 
 
function $(s) { 
 
    return document.getElementById(s) 
 
}

body { 
 
    font: 400 1em/1.4 sans-serif; 
 
}

<button id="btn_ice_cream"> 
 
    Ice Cream: <b id="count_ice_cream">0</b> 
 
</button> 
 
<br> 
 
<button id="btn_ice_cream_stands" disabled> 
 
    Ice Cream Stands: <b id="count_ice_cream_stands">0</b> 
 
</button>