从innerHTML更改为form时获得意外结果,输入类型文本Field

时间:2013-10-31 03:47:29

标签: javascript html

当我使用innerHTML测试我的代码时,var num1 = 57;得到正确的结果73.375,现在当更改代码使用输入类型文本框的表格输入数字57时它将预期结果更改为629.625 ..任何帮助都将不胜感激

<!DOCTYPE html>

<head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
      <link rel="style" href="css/main.css"  type"text/css"/>
      <title> Get final width </title>

      <script type= "text/javascript">

            function sum()
            {

            var num1;
            num1= document.getvalue.width.value;


            var acc1 = (num1 + 0.625)/(6.25-0.5); 
            var acc2 = Math.ceil((acc1 * 10) / 10) * 6.25 + (4.125 + 0.5);

            document.getElementById('finalwidth').value = (acc2).toFixed(3);
            document.getElementById("finalwidth").readOnly=true;
            }
      </script>       
</head>

<body>
            <div>
            <h3> when input is 57  final width result should be : 73.375</h3>
            <h3> when input is 100  final width result should be : 117.125</h3>
            </div>

            <form name= "getvalue">

                    <label for="width"> Width: </label>
                    <input type="text" name="width" maxlength="5" size="10" value=""/>

                    <input type="button" name="button" Value="calculate" onclick="sum()"/>

                    <label for="finalwidth"> Final width: </label>
                    <input type="text" id="finalwidth" name="finalwidth" maxlength="4" size="10" value=""/>

            </form> 
</body>

2 个答案:

答案 0 :(得分:0)

试试这个: - http://jsfiddle.net/adiioo7/6q8u5/1/

<强> JS: -

function sum() {

    var num1;
    num1 = parseInt(document.getvalue.width.value);


    var acc1 = (num1 + 0.625) / (6.25 - 0.5);
    var acc2 = Math.ceil((acc1 * 10) / 10) * 6.25 + (4.125 + 0.5);

    document.getElementById('finalwidth').value = (acc2).toFixed(3);
    document.getElementById("finalwidth").readOnly = true;
}

答案 1 :(得分:0)

当你这样做时:

num1 = document.getvalue.width.value;

num1 的值是一个字符串(因为表单控件值总是字符串)。所以当你这样做时:

num1 + 0.625

将值连接为字符串,而不是作为数字添加。因此,如果 num1 的值为57,则上述表达式的结果将为字符串570.625。因为进行了其他算术运算,所以最终结果为:

(num1 + 0.625)/(6.25 - 0.5)

将是一个数字。

简单的解决方法是使用一元+运算符将 num1 转换为数字:

var num1 = +document.getvalue.width.value;

var acc1 = (+num1 + 0.625)/(6.25 - 0.5)

您也可以更明确地使用Number作为函数:

var num1 = Number(document.getvalue.width.value);