2014-03-13 51 views
0

我想在我的ASP.NET項目中使用YQL查詢檢索股票信息。我正在使用jQuery使json調用來檢索數據。問題是當我點擊我的頁面上的'GetData'按鈕時,它只刷新頁面並且沒有數據顯示。如果我在Visual Studio中以調試模式運行項目,它會返回股票信息並顯示在頁面上,但是在調試結束時會清除頁面。下面是代碼:在ASP.NET中使用YQL和JQuery獲取股票信息

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head runat="server"> 
     <title></title> 
     <script src="Scripts/jquery-1.11.0.min.js" type="text/javascript"></script> 

     <script type="text/javascript"> 
      function getData() { 
       var url = "http://query.yahooapis.com/v1/public/yql"; 
       var data = encodeURIComponent("select * from yahoo.finance.quotes where symbol in ('MSFT')"); 
       $.getJSON(url, 'q=' + data + "&format=json&diagnostics=true&env=http://datatables.org/alltables.env") 
      .done(function (data) { 
       $("#result").text("Bid Price: " + data.query.results.quote.LastTradePriceOnly); 
       alert(data.query.results.quote.LastTradePriceOnly); 
      }) 
      .fail(function (jqxhr, textStatus, error) { 
       var err = textStatus + ", " + error; 
       $("#result").text('Request failed: ' + err); 
      }); 
      } 

     </script> 
    </head> 
    <body> 

     <form id="form1" runat="server">  
      <div id='result'>No Price</div> 
      <button type="submit" onClick="getData();">Get Data</button>   
     </form> 
    </body> 
    </html> 

的jsfiddle:http://jsfiddle.net/a3tuP/

有誰知道爲什麼得到的數據,即使數據獲取JSON調用返回清除?

謝謝。

回答

1

的形式上的按鈕提交您的提交行動 嘗試重新因子這樣的事情,並添加.preventDefault()

HTML

<form id="form1" runat="server">  
     <input type="text" id="symbol" /> 
     <div id='result'>No Price</div> 
     <button type="submit">Get Data</button> 
    </form> 

JS

function getData(e) { 
    //prevent sumbitting the form 
    e.preventDefault() 
    var url = "http://query.yahooapis.com/v1/public/yql"; 
    var symbol = $("#symbol").val(); 
    var data = encodeURIComponent("select * from yahoo.finance.quotes where symbol in ('BGG')"); 

    $.getJSON(url, 'q=' + data + "&format=json&diagnostics=true&env=http://datatables.org/alltables.env") 
     .done(function (data) { 
     $("#result").text("Bid Price: " + data.query.results.quote.LastTradePriceOnly); 
    }) 
     .fail(function (jqxhr, textStatus, error) { 
     var err = textStatus + ", " + error; 
      $("#result").text('Request failed: ' + err); 
    }); 
} 

//bind the submit event 
$(document).on("submit", "#form1" getData) 
+0

如果你關心IE9的支持,你需要添加&callback =?到你的url來強制jsonp數據類型。 – uberweb