Question

当用户点击“提交”按钮时，我正在尝试对这样的API进行AJAX调用。我希望通过获取用户输入文本框的值来形成API调用的URL。

<script type = "text/javascript">

$("#submit").click(function(){
  var stock = $("#stocks").val();
  var url = "http://dev.markitondemand.com/MODApis/Api/v2/Quote/jsonp?symbol=" + stock;

 $.ajax({
    url: url,
    dataType: 'jsonp',
    success: function(results){
        var status = results.Status;
        var company = results.Name;
        $('#results').append(status + '. Company is: ' + company);
    }
});

});  

</script>

身体看起来像这样，

<body>
  <input id="stocks" />
  <button type="submit" id="submit">Submit</button>

  <div id="results"></div>

</body>

$url会工作还是我做错了什么？

以下是我正在处理的代码的副本 -

Answer 1

将您的代码包装在文档就绪函数中，并将其放在页面底部：

<script type = "text/javascript">
$(function(){
$("#submit").click(function(){
  var stock = $("#stocks").val();
  var url = "http://dev.markitondemand.com/MODApis/Api/v2/Quote/jsonp?symbol=" + stock;
  console.log(stock);
 $.ajax({

    url: url,
    dataType: 'jsonp',
    success: function(results){
        var status = results.Status;
        var company = results.Name;
        $('#results').append(status + '. Company is: ' + company);

    }
});

});

});

</script>

demo here

Answer 2

解决问题的一种方法是用document.ready（）包装整个脚本，或者将代码显式地放在一个函数中，给它一个特定的名称，然后使用onlclick =＆＃34; myFunction调用该函数（）＆＃34;按钮的属性。

function loadDoc() {
   var stock = $("#stocks").val();
   var url = "http://dev.markitondemand.com/MODApis/Api/v2/Quote/jsonp?    symbol=" + stock;

   $.ajax({
       url: url,
       dataType: 'jsonp',
       success: function(results){
           var status = results.Status;
           var company = results.Name;
           $('#results').append(status + '. Company is: ' + company);
       }
   });
};

这就是你的按钮用于调用函数的方式：

<button type="button" onclick="loadDoc()">Request data</button>

以下是演示的链接：http://jsbin.com/pohofegiko/edit?html,output

如何根据用户输入进行API调用？

2 个答案: