在同一頁輸出表單結果

我試圖在窗體的同一頁上顯示錶單結果，但是當我點擊「Get Total」按鈕時，我看到結果短暫出現然後消失。我的結果也是關閉的，我試圖將我的變量加在一起，但是我得到了一個連接。在同一頁輸出表單結果

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

來源

2013-01-04 brandozz

嘗試在將它們加在一起之前解析變量'a'和'b' [String to Number convertion]（http://www.javascripter.net/faq/convert2.htm）。如果我沒有弄錯，會在最後添加一個「返回false」，這會阻止提交發生。 – atomman

它閃爍，因爲您沒有做任何事情來阻止表單提交，並且因爲您沒有將值作爲數字進行連接而進行連接。請注意，如果您使用的是非整數而不是parseInt，則可以使用parseFloat，正如我在下面所使用的。

試試這個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>

來源

2013-01-04 21:53:46 j08691

我不太喜歡'onclick'。 –

@ j08691完美！謝謝！ – brandozz

由於總是獲取字符串值，所以您得到了一個連接而不是總和。

例如，你可以乘以1，然後你的var將會被視爲一個數字。

來源

2013-01-04 21:52:41 nightfox79

發生了什麼事是你的JavaScript代碼工作，但然後提交正在執行。所有你需要做的是將type ='submit'改爲type ='button'，你將兩個數字連接在一起的原因是它不知道它是一個字符串還是一個數字，所以如果你放置顯示。 innerHTML = parseInt（a + b）;而不是display.innerHTML = a + b;它應該解決你的其他問題。

來源

2013-01-04 21:54:14

不正確。不夠。這隻會解決一個問題。 –

您的權利我沒有看到其他部分。他還需要做display.innerHTML = parseInt（a + b）; –

您試圖將兩個字符串添加在一起。你應該先分析其成整數： 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乘以所以這是一個額外的步驟。

來源

2013-01-04 21:55:54

http://jsperf.com/number-cast - 如果你追求速度，可以使用'parseFloat'。它擊敗'parseInt' 2：1; 'parseInt'也是2：1。一元加應該是最快的，但事實並非如此。一元加上仍然贏得了良好和可讀性。就int-cast而言，我印象深刻的是'~~'比'| 0'快。就Firefox而言，一切都是一樣的。 –

OK ... parseFloat在V8中的岩石，parseInt =一元加號，V8在* 1中很慢，我留下深刻的印象'~~'稍微勝過'| 0'。在FF中，parseInt比其他的更好，這完全一樣。 –

「結果短暫出現然後消失。」

使用try INPUT TYPE = 「按鈕」而不是輸入類型=「提交」。
否則（當使用輸入類型= 「提交」）避免表單提交，由在功能合計（）返回假，並把的onclick = 「總回報（）」。

來源

2014-04-22 20:32:51 Vatsal

在同一頁輸出表單結果

回答

相關問題