以Javascript提交數據

Question

使用用戶輸入的數字數據，我試圖將該數據發送到使用jQuery的FLOT，然後繪製點的函數。當我點擊提交時，警報函數返回「NaN」，但繼續繪製其他數據。我會做錯什麼？我是否需要將輸入放入表單中？

<input type="number" id="txt_name"> 
<input type="submit" value="Submit" onclick=" return hello();"> 
<script type="text/javascript"> 

var d1 = []; 
function hello(){ 

$(function() { 


    var x=document.getElementById('txt_name'); 
    var y=parseInt(x); 
    alert(y); 
    d1.push([x,x]); 
    d1.push([x+5,x+5]); 

    var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]]; 

    // A null signifies separate line segments 

    var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]]; 

    $.plot("#placeholder", [ d1, d2, d3 ]); 

    // Add the Flot version string to the footer 


}); 
} 
</script> 

Answer 1

你有一個問題，在這一行代碼：

var x=document.getElementById('txt_name'); 

這裏的問題是，的document.getElementById（「txt_name」）返回Element對象，用戶輸入的不是一個值。爲了搶一個值，你需要調用value屬性是這樣的：

var x=document.getElementById('txt_name').value; 

固定代碼：

<input type="number" id="txt_name"> 
<input type="submit" value="Submit" onclick=" return hello();"> 
<script type="text/javascript"> 

var d1 = []; 
function hello(){ 

$(function() { 


    var x=document.getElementById('txt_name').value; 
    var y=parseInt(x); 
    alert(y); 
    d1.push([x,x]); 
    d1.push([x+5,x+5]); 

    var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]]; 

    // A null signifies separate line segments 

    var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]]; 

    $.plot("#placeholder", [ d1, d2, d3 ]); 

    // Add the Flot version string to the footer 


}); 
} 
</script> 

更多here和here。

Answer 2

你必須從輸入

var x=document.getElementById('txt_name').value; 
var y=parseInt(x, 10);