我的JQuery腳本不檢索表單文本值

Question

我試圖從表單中獲取數據並使用最終結果的值。

問題是（至少在我調試時看起來是什麼樣子）是沒有值被重試並存儲在我創建的變量中。

這裏的形式：

<form> 
    <p> 
     <label for="numDigits">Number of Digits: </label> 
     <input type="text" id="numDigits" name="numDigits" /> 
    </p> 
    <p> 
     <label for="num1">First Number: </label> 
     <input type="text" id="num1" name="num1" /> 
    </p> 
    <p> 
     <label for="num2">Second Number: </label> 
     <input type="text" id="num2" name="num2" /> 
    </p> 
    <p> 
     <label for="num3">Third Number: </label> 
     <input type="text" id="num3" name="num3" /> 
    </p> 
    <p> 
     <input type="button" name="calc" id="calc" value="Calculate" /> 
    </p> 
    <p id="result">Result will be displayed here when the button is pressed.</p> 
</form> 

和jQuery腳本

$("#calc").on('click', function(){ 
    var a = Number($("#numDigits").val()); 
    var x = Number($("#num1").val()); 
    var y = Number($("#num2").val()); 
    var z = Number($("#num3").val()); 

    var total = a * 3 + x + ((a + x - y) % a) + ((a + z - y) % a); 
    $("#result").html("<p class='id'>" + total + "</p>"); 
}); 

在此先感謝您的幫助！

編輯：我將代碼更新爲工作版本。

Answer 1

它似乎運作良好：fiddle

不過需要注意的是，如果你要處理的輸入數字，你應該寫

var a = Number($("#numDigits").val()); 
var x = Number($("#num1").val()); 
var y = Number($("#num2").val()); 
var z = Number($("#num3").val()); 

Answer 2

用html（）替換replaceWith（）。我擁有的DEMO工作：

$("#calc").click(function(){ 
var a = $("#numDigits").val(); 
var x = $("#num1").val(); 
var y = $("#num2").val(); 
var z = $("#num3").val(); 

var total = a * 3 + x; 
total += ((y - x) % a); 
total += ((y - z) % a); 
$("#result").html(total); 
});