Javascript 如何更新股票报价API以接收搜索结果？_Javascript_Ajax

Javascript 如何更新股票报价API以接收搜索结果？

javascript ajax

Javascript 如何更新股票报价API以接收搜索结果？,javascript,ajax,Javascript,Ajax,这是我关于StackOverflow的第一个问题。我正在研究如何在学校作业中使用API，我发现了一个返回股票报价的API（来自Markit on demand）——但我不知道如何更新JS以从DOM查询搜索结果。现在，它只搜索预定义的“AAPL”符号-如何更新JS以查询搜索结果？谢谢大家! /** *版本1.0，2012年1月 */ var Markit={}； /** *定义QuoteService。 *第一个参数是引号的符号（字符串）。示例：AAPL、MSFT、JNJ、GOOG。 *第二个

这是我关于StackOverflow的第一个问题。我正在研究如何在学校作业中使用API，我发现了一个返回股票报价的API（来自Markit on demand）——但我不知道如何更新JS以从DOM查询搜索结果。现在，它只搜索预定义的“AAPL”符号-如何更新JS以查询搜索结果？谢谢大家!

/**
*版本1.0，2012年1月
*/
var Markit={}；
/**
*定义QuoteService。
*第一个参数是引号的符号（字符串）。示例：AAPL、MSFT、JNJ、GOOG。
*第二个参数是fCallback，一个在API成功时执行的回调函数。
*/
Markit.QuoteService=函数（sSymbol，fCallback）{
this.symbol=sSymbol；
this.fCallback=fCallback；
this.DATA_SRC=”http://dev.markitondemand.com/Api/v2/Quote/jsonp";
这是makeRequest（）；
};
/**
*Ajax成功回调。fCallback是QuoteService构造函数中的第二个参数。
*/
Markit.QuoteService.prototype.handleSuccess=函数（jsonResult）{
this.fCallback（jsonResult）；
};
/**
*Ajax错误回调
*/
Markit.QuoteService.prototype.handleError=函数（jsonResult）{
console.error（jsonResult）；
};
/** 
*启动对QuoteAPI的新ajax请求
*/
Markit.QuoteService.prototype.makeRequest=函数（）{
//中止任何打开的请求
如果（this.xhr）{this.xhr.abort（）；}
//启动新请求
this.xhr=$.ajax({
数据：{symbol:this.symbol}，
url:this.DATA\u SRC，
数据类型：“jsonp”，
成功：这是一个简单的成功，
错误：this.handleError，
背景：这
});
};
新的Markit.QuoteService（“AAPL”，函数（jsonResult）{
//捕捉错误
如果（！jsonResult | | jsonResult.Message）{
错误（“错误：”，jsonResult.Message）；
返回；
}
//如果一切顺利，你的报价将在这里。
log（jsonResult）；
//现在继续处理数据。
$（“.results”）.first（）.append（“名称：“+jsonResult.Name+”
符号：“+jsonResult.Symbol+”
最新价格：“+jsonResult.LastPrice+”更改：“+jsonResult.Change+”；
/**
* http://dev.markitondemand.com
*/
});

搜索股票
提交
Markit.QuoteService是这里的主要内容，您必须向它传递两个参数
1报价单
2是函数回调，以防它设法提取数据
将以下函数添加到代码中
function submitForm(){
 stock = $('#stock_search').val();
 Markit.QuoteService(sock,drawHtml);
 return false;
}

function drawHtml(jsonResult){
  $(".results").first().append("<p>Name: " + jsonResult.Name + "</p> <p>Symbol: " + jsonResult.Symbol + "</p><p>Last Price: " + jsonResult.LastPrice + "</p><p>Change: " + jsonResult.Change + "</p>");
}

函数submitForm（）{
股票=$（“#股票搜索”）.val（）；
Markit.QuoteService（sock、drawHtml）；
返回false；
}
函数drawHtml（jsonResult）{
$（“.results”）.first（）.append（“名称：“+jsonResult.Name+”
符号：“+jsonResult.Symbol+”
最新价格：“+jsonResult.LastPrice+”更改：“+jsonResult.Change+”；
}

将提交事件添加到表单中
<form onsubmit="return submitForm();">



没有Markit内容的完整工作示例：
<!DOCTYPE HTML>
<html>
  <head>      
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <title></title>
  </head>
  <body>
    <form action="" onsubmit="return submitForm()">
      Search Stocks
      <input name="stock" type="text" id="stock_search" />
      <input type="submit" value="submit">
    </form>
    <div id="results">
    </div>

    <script type="text/javascript">
      function getStock(stock) {
        $.ajax({
          url: 'http://dev.markitondemand.com/Api/v2/Quote/jsonp',
          data: {'symbol': stock},
          jsonp: "callback",
          dataType: "jsonp",
          success: function(ds){
            drawHtml(ds);
          }
        });
        return false;
      }
      function submitForm() {
        stock = $('#stock_search').val();
        getStock(stock);
        return false;
      }

      function drawHtml(jsonResult) {
        $("#results").append("<p>Name: " + jsonResult.Name + "</p> <p>Symbol: " + jsonResult.Symbol + "</p><p>Last Price: " + jsonResult.LastPrice + "</p><p>Change: " + jsonResult.Change + "</p>");
        return false;
      }
    </script>
  </body>
</html>


搜索股票
函数getStock（stock）{
$.ajax({
网址：'http://dev.markitondemand.com/Api/v2/Quote/jsonp',
数据：{'symbol'：股票}，
jsonp：“回调”，
数据类型：“jsonp”，
成功：功能（ds）{
绘图HTML（ds）；
}
});
返回false；
}
函数submitForm（）{
股票=$（“#股票搜索”）.val（）；
getStock（股票）；
返回false；
}
函数drawHtml（jsonResult）{
$（“#results”）.append（“名称：“+jsonResult.Name+”
符号：“+jsonResult.Symbol+”
最新价格：“+jsonResult.LastPrice+”
更改：“+jsonResult.Change+””；
返回false；
}