javascript - 当输入类型文本小于 0 或大于 24 时，如何禁用输入类型按钮？

Question

我需要制作一个积分计算器，用户将输入对象的数量，网站会告诉他们值多少积分。到目前为止，我设法做到了，但我想不出任何方法可以阻止用户使用比现有更多的对象。这是代码：

 <form>
 <input type="text" name="ob1" size="3" value="0/24" onClick="this.value='';" /> object      <input type="text" name="ob2" size="3" value="0/24" onClick="this.value='';" />
 <br>
 <input type="button" value="Calculate Points" onClick="document.getElementById('calcu').innerHTML='Supply points are ' + (ab1.value*5) +'. Tower points are '+(ab2.value*10)+'.'" name="clc"></form>
 <div id="calcu"></div>

Answer 1

jsFiddle（http://jsfiddle.net/gP7SP/15/）

我会做一些假设，但在这里你去：

<form>
    Supply:<input type="text" id="supply" name="ob1" size="3" value="0/24" onClick="this.value='';" />
    Tower:<input type="text" id="tower" name="ob2" size="3" value="0/24" onClick="this.value='';" />
    <br/>
    <input type="button" value="Calculate Points" onClick="calculate()" name="clc">
</form>

<div id="calcu"></div>

<script type="text/javascript">
    function calculate()
    {
        // Retrieve the supply and tower values
        var supply = parseInt( document.getElementById("supply").value );
        var tower = parseInt( document.getElementById("tower").value );

        // Make sure supply is less than 24
        if ( supply > 24 )
        {
            alert( "Supply cannot be greater than 24" );
        }
        // Make sure tower is less than 24    
        else if ( tower > 24 )
        {
            alert( "Tower cannot be greater than 24" );
        }
        else
        {
            // Computer new values
            supply = supply * 5;
            tower = tower * 10;

            // Write the values to the calcu div
            document.getElementById("calcu").innerHTML = "Supply points: " + supply + ", Tower points: " + tower;
        }
    }
</script>

Answer 2

您不需要禁用文本框，只需触发警报作为错误消息。

类似于以下内容：

var obj1 = document.forms["form_name"]["obj1"].value;
if (obj1 < 0 || obj1 > 24) {
   alert("Error message");
   return false;
}