爲什麼在使用javascript提交表單時值未定義？

Question

的javascript：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script> 
$(function() { 
    // 
    $('#button_submit').click(function() { 
    var start_date = $('start_date').val(); 
    var end_date = $('end_date').val(); 
    var type = $('type').val(); 
    alert(start_date); 
    }); 
}); 
// 
function drawChart() { 
    var jsonData = $.ajax({ 
    url: "visits/day.php?start_date=" + start_date + "&end_date=" + end_date, 
    dataType: "json", 
    async: false 
    }).responseText; 

    var obj = jQuery.parseJSON(jsonData); 
    var data = google.visualization.arrayToDataTable(obj); 


    var options = { 
    title: 'Number of visitors' 
    }; 

    if (type === 'pie') { 
    var chart = new google.visualization.PieChart(
     document.getElementById('chart_div')); 
     chart.draw(data, options); 
    } 
    if (type === 'bar') { 
    var chart = new google.visualization.BarChart(
     document.getElementById('chart_div')); 
     chart.draw(data, options); 
    } 
} 

HTML：通過形式獲得

<form id="myForm"> 
    <input type="text" name="start_date" id="start_date"><br /> 
    <input type="text" name="end_date" id="end_date"><br /> 
    <input type="text" name="type" id="type"><br /> 
    <input type="button" id="button_submit" value="go"> 
</form> 
<div id="chart_div" style="width: 900px; height: 500px;"></div> 

變量似乎空，我已經做到了警示（開始），並說：undifined，而不是通過網址：訪問/ day.php？start_date ...

我需要該值發送出我的php頁面，而不刷新頁面

我在做什麼錯？

Answer 1

添加到上面......我看不出你傳遞start_date和end_date您drawChart()功能：

編輯以呼叫添加到drawChart（）

$(function() { 
    // 
    $('#button_submit').click(function() { 
    var start_date = $('#start_date').val(); 
    var end_date = $('#end_date').val(); 
    var type = $('#type').val(); 
    drawChart(start_date, end_date) 
    console.log(start_date, end_date, type); 
    }); 
}); 
function drawChart(start_date, end_date) { 
    var jsonData = $.ajax({ 
    url: "visits/day.php?start_date=" + start_date + "&end_date=" + end_date, 
    dataType: "json", 
    async: false 
    }).responseText; 

Answer 2

var start_date = $('#start_date').val(); 
var end_date = $('#end_date').val(); 
var type = $('#type').val(); 

這將通過id（#接着id值）找到的HTML元素。

$('start_date').val(); 

上面會找到標籤名稱<start_date>

下一個的元素，你的變量具有功能可見性範圍。所以它們只能在匿名函數中定義（和可見）（這是button_submit點擊處理程序的回調函數）。