当输入类型文本小于0或大于24时,如何禁用输入类型按钮?

时间:2012-04-24 21:46:27

标签: javascript html css button

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

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

2 个答案:

答案 0 :(得分:0)

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>

答案 1 :(得分:0)

您无需禁用文本框,只需将警报作为错误消息触发。

有些事情:

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