编码一个JSONP <SCRIPT SRC =请求

我试图访问谷歌图书以一个ISBN码得到一本书的细节，我有很多的问题，它们是：编码一个JSONP <SCRIPT SRC =请求

A）我想组装一个脚本请求，例如将ISBN代码连接到URL中。我没有成功地做到这一点 - 我不知道为什么。

B）然后我想用这个生成的脚本动态更新DOM中的div，然后执行。

C）我发现它对于返回数据的格式和Google响应中包含的函数调用的参数名称有点困惑。

有其他人遇到同样的问题，并可以提供指导重新A通过C上面。

我附上下面的JavaScript代码。

 $(document).ready(function() { 

      $('#viewbook-button').live('click', function() { 
       isbnCode = this.text; 

       alert("ISBN is : " + isbnCode + " " + this.text + " as well"); 

       alert("Getting JSONP Google Books data"); 

       isbnCode = "0451526538"; 

       JSONPstr = '<' + 'script ' + 'src="' + 'https://www.googleapis.com/books/v1/volumes?q=ISBN' + isbnCode; 
       JSONPstr = JSONPstr + '&callback=handleJSONPResponse">' + '</script>'; 

       alert("un-Escaped JSONP string" + JSONPstr); 

       escJSONPstr = escape(escJSONPstr); 

       alert("Escaped JSONP string"); 

       //divstr = ""; 
       //divstr = divstr + escape(<script src="); 
       //divstr = divstr + encodeURIComponent(https://www.googleapis.com/books/v1/volumes?q=ISBN); 
       //divstr = divstr + escape(isbnCode); 
       //divstr = divstr + encodeURIComponent(&callback=handleJSONPResponse); 
       //divstr = divstr + escape("></); 
       //divstr = divstr + escape(script); 
       //divstr = divstr + escape(>); 


       $('#jsonp-call').html(escJSONPstr); 

       // This will cause the handleJSONPResponse function to execute when the script is dynamically loadedinto div. 
       // The data wrapped in a function call will be returned from the Google Books server. 
       // This will cause the handleJSONPResponse function to execute below. 

      }); // end viewbook-button 
     });  // end document.ready 

     function handleJSONPResponse(response) { 
      var tmp = response; 
      alert(tmp); 

     }; 

    </script> 


    </head> 

    <body> 
    <h2>Show Details of Books Ordered by a Customer</h2> 
    <a href="#" id="getcusts-button">Get Customer Details</a> 
    <br/><br/> 
    <div id="tablist">Tables will be Listed Here</div> 
    <br/><br/> 
    <div id="Google-call">The JSONP generated src= statement will go here and execute</div> 

    </body> 
</html>

编辑：

问题解决了 - 感谢大家。

来源

2011-12-19 JimmyBandit

Joe，下次使用更通用的标签（如jQuery和Javascript），因为人们遵循特定的标签来找到他们可以提供帮助的问题。 – iwasrobbed 2011-12-20 15:03:38

如何关闭请求iWasRobbed – JimmyBandit 2011-12-20 18:16:57

不确定你的意思，乔。关闭什么请求？ – iwasrobbed 2011-12-20 18:32:14

您正在重新发明轮子：jQuery具有内置的JSONP支持，因此您不需要为自己实现而付费。使用$.ajax方法：

$.ajax({ 
    url: 'https://www.googleapis.com/books/v1/volumes?q=ISBN' + isbnCode, 
    dataType: 'jsonp', 
    success: function(response) { 
     console.log(response); // log the response object to the console 
    } 
});

这应该是你所需要做的。

来源

2011-12-20 15:09:47 lonesomeday

非常感谢 - 我会尝试。 – JimmyBandit 2011-12-20 17:14:27

@lonesomeday：还有'getJSON'方法可以更方便。它使用'ajax'。只要确保在URL中包含'callback =？'。 http://api.jquery.com/jQuery.getJSON/#jsonp – Gruber 2012-12-14 12:15:44

@Gruber是的，这是一个选项。就个人而言，我更喜欢在我的代码中明确表示，而不是依赖幕后魔法，所以我更喜欢指定'jsonp'而不是'callback =？'，这在一读时就不那么清晰了。 – lonesomeday 2012-12-14 14:42:11

编码一个JSONP <SCRIPT SRC =请求

回答

相关问题