2017-08-08 53 views
0

我正在创建一个Dropbox来创建图表。我一直在使用函数change()从组合框中获取文本值。这是代码:组合框代码的错误是什么?

\t \t 
 
\t \t //Load the Visualization API and the chart package. 
 
\t \t google.charts.load('current', {'packages':['corechart']}); 
 
\t \t //google.load('visualization', '1', {'packages':['corechart','table']}); 
 

 
\t \t //get the selected value 
 
\t \t function change() { 
 
\t \t \t var listbox = document.getElementById("chart"); 
 
\t \t \t var selIndex = listbox.seletedIndex; 
 
\t \t \t var selValue = listbox.options[selIndex].value; 
 
\t \t \t var selText = listbox.options[selIndex].text; 
 
\t \t \t 
 
\t \t \t //console.log(selValue); 
 
\t \t 
 

 
\t \t //chart for apply job post 
 
\t \t google.charts.setOnLoadCallback(dashboardDraw); 
 

 
\t \t function dashboardDraw(x, y){ 
 

 
\t \t \t //get the location data from table 
 
\t \t \t var jsonLocationData = $.ajax({ 
 
\t \t \t \t \t url: "post_location.php", 
 
\t \t \t \t \t data: '{}', 
 
\t \t \t \t \t dataType: "json", 
 
\t \t \t \t \t async: false 
 
\t \t \t \t \t }).responseText; 
 

 
\t \t \t //create our data table out of json data loaded from server 
 
\t \t \t var LocationData = new google.visualization.DataTable(jsonLocationData); 
 

 
\t \t \t //get the company data from table 
 
\t \t \t var jsonCompanyData = $.ajax({ 
 
\t \t \t \t \t url: "post_company.php", 
 
\t \t \t \t \t data: '{}', 
 
\t \t \t \t \t dataType: "json", 
 
\t \t \t \t \t async: false 
 
\t \t \t \t \t }).responseText; 
 

 
\t \t \t //create our data table out of json data loaded from server 
 
\t \t \t var CompanyData = new google.visualization.DataTable(jsonCompanyData); 
 
\t \t \t 
 
\t \t \t 
 
\t \t \t //company chart details 
 
\t \t \t var optionsLocation = { 
 
     \t \t \t title: 'Job Posts by Location', 
 
     \t \t \t pieSliceText: 'label', 
 
     \t \t \t tooltip: {isHtml: true}, 
 
     \t \t \t width: 700, 
 
     \t \t \t height: 500, 
 
     \t \t \t chartArea: { left:"5%",top:"5%",width:"90%",height:"90%" } 
 
     \t \t }; 
 
\t \t \t 
 

 
     \t \t //company chart details 
 
     \t \t var optionsCompany = { 
 
     \t \t \t title: 'Job Posts by Company', 
 
     \t \t \t pieSliceText: 'label', 
 
     \t \t \t tooltip: {isHtml: true}, 
 
     \t \t \t width: 700, 
 
     \t \t \t height: 500, 
 
     \t \t \t chartArea: { left:"5%",top:"5%",width:"90%",height:"90%" } 
 
     \t \t }; 
 
\t \t \t 
 
     \t \t var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 
 
     \t \t \t if (selValue == 'location_val') { 
 
     \t \t \t x = LocationData; 
 
     \t \t \t y = optionsLocation; 
 
     \t \t \t } 
 
     
 
     \t \t \t if (selValue == 'company_val') { 
 
     \t \t \t x = CompanyData; 
 
     \t \t \t \t y = optionsCompany; 
 
     \t \t \t } 
 
     
 
     \t chart.draw(x, y); 
 
    \t } 
 
    \t \t 
 
     
 

 
    \t \t \t \t 
 
\t } \t
\t <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
 
\t <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
 

 

 
    
 

 

 
<table> 
 
    <th> 
 
     <select id="chart" name="select1" onchange="change()"> 
 
     \t <option selected disabled="select">Select</option> 
 
     \t <option value="company_val">By Company</option> 
 
     \t <option value="location_val">By Location</option> 
 
     </select> 
 
    </th> 
 
</table> 
 
    <div id="chart_div"></div>

控制台显示以下错误:

TypeError: listbox.options[selIndex] is undefined[Learn More] dashboard.php:25:8

代码的问题一部分是这样的:

var selValue = listbox.options[selIndex].value; 
    var selText = listbox.options[selIndex].text; 

哪有我解决了这个问题?我检查了代码,没有语法问题。

+0

您是否检查过'selIndex'实际包含的值? – CBroe

+0

值是undefined – joun

回答

1

您是否尝试过使用您的调试器?

如果您使用内置在浏览器中的调试工具并在错误发生的行之前设置断点,您将看到selIndex未定义。所以你会看看分配一个值的那一行。

var selIndex = listbox.seletedIndex; 

你的错误是在该行,使用调试器,你可以看到,包括selectedIndex注意c在列表框中的可用属性。

+0

即时通讯使用mozila调试器控制台,它显示上述错误 – joun

+0

他的意思是改变'seletedIndex'到'selectedIndex' – ewwink

+0

owh ..感谢你..它解决了这个问题。有时在检查我们自己的代码时,通常这个问题不能被看到,尽管它是一个明显错误的类型代码。 – joun