2013-07-15 5 views
2

Я довольно новичок в JavaScript. У меня есть переменная и две кнопки для добавления или минус 1 из этой переменной, которая работает; Однако я хочу сделать так, что, когда переменная = 0 кнопка минус отключает, так что переменная не пойдет ниже 0.Как отключить кнопку в зависимости от значения переменной?

<head> 
    <script type="text/javascript"> 
     var a = 0; 
     var add = function(valueToAdd) { 
      a += valueToAdd; 
      document.getElementById('Value').innerHTML = a; 
     } 
    </script> 
</head> 
<body> 
    Value:<span id="Value">0</span> 
    <button type="button" id = add onclick="javascript:add(1)">+</button> 
    <button type="button" id = minus onclick="javascript:add(-1)">-</button> 
</body> 
+0

ОК так что же вы делаете? – Neal

+1

Последняя строка функции add: 'document.getElementById (« минус »). Disabled = (a == 0);' – Scott

ответ

1
<head> 
<script type="text/javascript"> 
    var a = 0; 
    var add = function(valueToAdd){ 
     a += valueToAdd; 
     document.getElementById('Value').innerHTML = a; 

     if(a == 0) { 
      document.getElementById('minus').disabled = true; 
     } else { 
      document.getElementById('minus').disabled = false; 
     } 
    }  

</script> 

</head> 

<body> 
    Value:<span id="Value">0</span> 
    <button type="button" id = add onclick="javascript:add(1)">+</button> 
    <button type="button" id = minus onclick="javascript:add(-1)">-</button> 


</body> 
+0

Также помните, что поскольку значение intial будет равно нулю, 'This ' neeeds должно быть следующим:' ' – ObieMD5

1

Используй disabled атрибут:

var add = function(valueToAdd) 
{ 
     document.getElementById('minus').disabled = (a+valueToAdd == 0); 
     a += valueToAdd; 
     document.getElementById('Value').innerHTML = a; 
} 
1

Вы можете использовать атрибут кнопки disabled.

var a = 0; 
var add = function(valueToAdd) { 
    a += valueToAdd; 
    document.getElementById('Value').innerHTML = a; 

    // Add this line, it will disable when a is 0 
    document.getElementById("minus").disabled = (a==0); 
} 

Вы также должны обновить код своей кнопки. Обработчик javascript: не требуется, и ваши идентификационные атрибуты должны быть указаны.

<button type="button" id="add" onclick="add(1)">+</button> 
<button type="button" id="minus" onclick="add(-1)" disabled="disabled">-</button> 

Я также добавил disabled="disabled" на кнопку минуса, поскольку начальное значение будет равно 0.

1

Первые: Пожалуйста, поставьте кавычки вокруг идентификаторов, и удалить инлайн ЯШИ:

<button type="button" id="add">+</button> 
<button type="button" id="minus">-</button> 

Следующая:

Написать обработчик события щелчка кнопки:

var val = document.getElementById('Value'); 
var add = document.getElementById('add'); 
var subs = document.getElementById('minus'); 
var eventHandler = function(event) { 
    var value = parseInt(val.innerText || val.innerHTML); 
    if(this.id === 'add') { value++; } 
    else if(this.id === 'minus') { value--;} 
    val.innerHTML = value; 
    if(value <= 0) { 
     subs.disabled = true; 
    } 
    else { 
     subs.disabled = false; 
    } 
}; 

Затем крючок EventHandler в кнопках:

add.onclick = eventHandler; 
subs.onclick = eventHandler; 

скрипку Demo: http://jsfiddle.net/maniator/wevG4/

2

Что-то вроде:

a = Math.max(0, a+valueToAdd); // prevents a from dropping below 0 
document.getElementById('minus').disabled = !a; // disables the minus button if a = 0 
Смежные вопросы