Question

我是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>

Answer 1

类似的东西：

a = Math.max(0, a+valueToAdd); // prevents a from dropping below 0
document.getElementById('minus').disabled = !a; // disables the minus button if a = 0

Answer 2

<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>

Answer 3

使用disabled属性：

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

Answer 4

您可以使用按钮元素的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:处理程序不是必需的，您的id属性应该被引用。

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

我还将disabled="disabled"添加到减号按钮，因为初始值为0。

Answer 5

首先：请在你的ID周围加上引号，然后删除内联js：

<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;

小提琴演示：http://jsfiddle.net/maniator/wevG4/

如何根据变量值禁用按钮？

5 个答案: