jsFiddle中的AJAX
你如何模拟jQuery $.get()
从jsFiddle中的不同域加载数据?
/* This won't work in jsFiddle. */ $.get("http://www.google.com", function(data) { ... } );
我们知道,有限制:
由于浏览器安全限制,大多数“Ajax”请求都遵循相同的原始策略; 请求无法成功从其他域,子域或协议中检索数据。
我通过在jsFiddle中创建一个Fiddle来解决这个问题,仅用于测试Ajax负载。 这是一个非常简单的HTML,带有图像和一些副本 – 你可以在这里看到它:
This post will help you get to know the iOS SDK a little better. It leads you through some choreographed steps of iOS app development, even if you have little or no programming knowledge. It covers some key principles and applies these directly to something useful and relevant: the creation of a simple but functioning portfolio app for the iPhone.
body { font-family: Arial; color: #333333; line-height: 1.4em; } img { margin: 0 0 1em 1em; padding: 1em; background: #ffffff; border: 1px solid #eaeaea; display: inline-block; float: right; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; } .container { background: #fafafa; padding: 1em; }
JS小提琴演示 。
如果您使用Firebug单击“结果”框架,则可以获取iframe的源URL。 当您将此源URL复制到包含Ajax请求的Fiddle时,它将起作用,因为它现在位于同一个域中。 这是一个演示:
body { font-family: Arial; } .excontainer { padding: 1em; } label { display: block; width: 100%; } p { padding: .5em; } a, a:visited { color: #2d9afd; } .changed { color: #ff0099; } .highlight { background: #faffda; } .entered { color: #f5560a; } .green { color: #7fbf38; } .hellomouse, .clickable, #foo, #event { cursor: pointer; } button { margin-bottom: 1em; } div { margin: 1em 0; } #foo { display: inline-block; } ul { margin: 1em 0; } .form, form, .stuff, .morestuff, stuff3 { margin: 1em 0; padding: 1em; background: #ececec; } input { font-size: 1.1em; padding: 2px; } .placeholder { color: #ff0099; font-weight: normal; } ::-webkit-input-placeholder { color: #cccccc; } :-moz-placeholder { color: #cccccc; } :-ms-input-placeholder { color: #cccccc; } :focus::-webkit-input-placeholder { color:transparent; } .content { margin-top: 5px; padding: 1em; background: #eeeeee; }
// learn jquery ajax // http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/ // no need to specify document ready $(function(){ // don't cache ajax or content won't be fresh $.ajaxSetup ({ cache: false }); var ajax_load = ""; // load() functions var loadUrl = "http://fiddle.jshell.net/deborah/pkmvD/show/"; $("#loadbasic").click(function(){ $("#result").html(ajax_load).load(loadUrl); }); // end });
JS小提琴演示 。
查看如何在JQuery中使用JSFiddle echofunction? 。
另请查看他们的API ,其中给出了如何实现此目的的示例。
这个简单的例子应该做,试试小提琴 。
您需要创建一个JSON对象,将实际数据包装在json元素中。
var callEcho = function(json) { $.ajax({ url: "/echo/json/", type: "POST", data: json }).done(function(resp) { console.log(resp); }); }; $.get("http://echo.jsontest.com/key/value/one/two", function(data) { var json = { json: JSON.stringify(data) }; callEcho(json); });
如果您只是尝试做一些示例,可以使用JSONP和twitter api进行测试。 如果您的服务器支持JSON请求,那么我认为不应该有任何问题。
只需将数据类型设置为JSON,如下所示
$.ajax("http://search.twitter.com/search.json", { data: { q: 'jquery' }, dataType: 'jsonp' });
这有帮助吗?