Question

我正在尝试在与表单相同的页面上显示表单结果，但是当我单击“获取总计”按钮时，我看到结果会短暂显示然后消失。我的结果也是关闭的，我正在尝试将我的变量添加到一起，但我正在加入一个连接。

<form id="percentageBiz" method="post">
<input type="text" id="sum1">
<input type="text" id="sum2">
<input type="submit" onclick="total()" value="Get Total">

<div id="display" style="height: 50px; width: 100%;"></div>

<script>
function total(){
    var a = document.forms["percentageBiz"]["sum1"].value;
    var b = document.forms["percentageBiz"]["sum2"].value;
    //alert(a+b)
    var display=document.getElementById("display")
    display.innerHTML=a+b;
}
</script>

Answer 1

它正在闪烁，因为你没有做任何事情来阻止表单提交和连接，因为你没有将值转换为数字。请注意，如果您使用的是非整数而不是parseFloat，则可以使用parseInt。

试试 jsFiddle example 。

function total(){
    var a = document.forms["percentageBiz"]["sum1"].value;
    var b = document.forms["percentageBiz"]["sum2"].value;
    //alert(a+b)
    var display=document.getElementById("display")
    display.innerHTML=parseInt(a,10)+parseInt(b,10);
    return false;
}

和

<form id="percentageBiz" method="post">
<input type="text" id="sum1">
<input type="text" id="sum2">
<input type="submit" onclick="return total()" value="Get Total">
</form>
<div id="display" style="height: 50px; width: 100%;"></div>

Answer 2

“结果会短暂显示然后消失。”

尝试使用输入类型=“ 按钮 ”，而不是输入type =“ 提交 ”。
OR Else（使用输入类型=“提交”时）通过在函数total（）中返回 false 来避免表单提交 onclick =“返回总计（）”。

Answer 3

正在发生的事情是你的javascript代码正在运行，但随后提交正在执行。您需要做的就是将type ='submit'切换为type ='button'，并且您将这两个数字连接在一起的原因是因为它不理解它是字符串还是数字，所以如果您放置显示。 innerHTML = parseInt（a + b）;而不是display.innerHTML = a + b;它应该解决你的其他问题。

Answer 4

您正在尝试将两个字符串添加到一起。你应该先将它们解析为整数： http://www.javascripter.net/faq/convert2.htm

    <form id="percentageBiz" method="post">
<input type="text" id="sum1">
<input type="text" id="sum2">
<input type="submit" onclick="total()" value="Get Total">

<div id="display" style="height: 50px; width: 100%;"></div>

<script>
function total(){
    var a = parseInt(document.forms["percentageBiz"]["sum1"].value);
    var b = parseInt(document.forms["percentageBiz"]["sum2"].value);
    //alert(a+b)
    var display=document.getElementById("display")
    display.innerHTML=a+b;
}
</script>

你不应该将它们乘以1来进行强制转换，因为这会将字符串解析为整数并将其乘以1.所以这是一个额外的步骤。

Answer 5

你得到一个连接而不是和，因为你总是得到字符串值。

例如，您可以将它们乘以1，然后将var作为数字处理。

输出表单在同一页面上显示

5 个答案: