[英]Get List of jQuery UI themes - from an URL (same-origin-policy)
有谁知道从http://jquery-ui.googlecode.com/svn/tags/1.8.23/themes/获取jQuery主题列表的方法?
我正在使用主题滚动创建简单的网页,用户可以动态切换主题。
工作小提琴 - 单击右上角的主题并选择一个新主题。
现在列表硬编码如下,
<div id="theme-list">
<ul>
<li class="themes-el ui-state-highlight" data-theme="cupertino">cupertino</li>
<li class="themes-el" data-theme="hot-sneaks">hot-sneaks</li>
<li class="themes-el" data-theme="smoothness">smoothness</li>
<li class="themes-el" data-theme="pepper-grinder">pepper-grinder</li>
<li class="themes-el" data-theme="ui-lightness">ui-lightness</li>
<li class="themes-el" data-theme="ui-darkness">ui-darkness</li>
<!-- and more -->
</ul>
</div>
有没有办法从URL http://jquery-ui.googlecode.com/svn/tags/1.8.23/themes/获取这个主题列表? (crossDomain: http : //www.w3.org/TR/cors/#access-control-allow-origin-response-hea )
尝试,但失败的代码如下..
$.ajax({
url: 'http://jquery-ui.googlecode.com/svn/tags/1.8.23/themes/',
dataType: 'text',
beforeSend: function ( xhr ) {
xhr.setRequestHeader("Access-Control-Allow-Origin", 'http://jquery-ui.googlecode.com');
xhr.setRequestHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS");
},
crossDomain: true,
success: function (data) {
alert(data);
},
error: function (jqXHR, textStatus, errorThrown) {
alert(errorThrown + ' ' + textStatus + ' ' + jqXHR.responseText);
}
});
感觉我在这里错过了很多......任何见解都会有所帮助。
似乎服务器不允许跨域请求。 你什么都做不了。
您可以设置一个可以卷曲该页面的PHP脚本,然后您就可以调用PHP脚本了。 像kuncajs所说的那样
您可以在服务器上使用这个简短的PHP curl脚本:
<?php
$ch = curl_init();
// URL to grab
curl_setopt($ch, CURLOPT_URL, 'http://jquery-ui.googlecode.com/svn/tags/1.8.23/themes/');
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
$output = curl_exec($ch);
curl_close($ch);
print_r($output);
?>
然后它只是一个简单的ajax脚本:
$.ajax({
url: "linktoscript.php",
dataType: "html",
success: function(data) {
console.log(data);
},
error: function (request, status, error) {
console.log(request);
console.log(status);
console.log(error);
}
});
我从yahoo(YQL)和使用YQL获取跨域内容的jQuery插件发现了这个跨域请求 。
http://james.padolsey.com/javascript/cross-domain-requests-with-jquery/
演示: http : //jsfiddle.net/SXHrB/4/
下面的代码简单地提取了我解析的整个页面以获取所需的内容。
$.ajax({
url: 'http://jquery-ui.googlecode.com/svn/tags/1.8.23/themes/',
type: 'GET',
success: function(data) {
alert(data.responseText.substring(data.responseText.indexOf('<ul>'), data.responseText.lastIndexOf('</ul>') + 4));
}
});
您是否尝试过使用JQuery使用的主题切换器插件:
它将提供JQuery用于演示目的的所有现成主题。
<script src="jquery.js"></script>
<script type="text/javascript" src="themeSwitcher.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#switcher').themeswitcher();
});
</script>
<div id="switcher"></div>
你可以让你的网站添加一个这样的风格的链接:
当你点击新主题时,javascript会在头部添加一个链接标签,你可以用这里的任何名字替换链接的ui-lightness部分: http : //jquery-ui.googlecode.com/svn/tags/1.8 .23 / themes /希望这会有所帮助
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.