7

http://jquery-ui.googlecode.com/svn/tags/1.8.23/themes/からjQueryテーマのリストを取得する方法を知っている人はいますか?

ユーザーがテーマを動的に切り替えることができるテーマローラーを使用して、単純なWebページを作成しています。

作業フィドル-右上隅のテーマをクリックして、新しいテーマを選択します。

現在、リストは次のようにハードコーディングされています。

<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>

このテーマのリストをURLhttp://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);
    }
});

私はここで多くを逃しているように感じます..どんな洞察も本当に役に立ちます。

4

4 に答える 4

7

サーバーがクロスドメインリクエストを許可していないようです。あなたにできることは何もありません。

そのページをカールさせることができるPHPスクリプトを設定してから、PHPスクリプトをajaxすることができます。kuncajsが言ったことのように

サーバーで次の短いPHPcurlスクリプトを使用できます。

<?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);
    }
});
于 2012-10-02T01:26:29.100 に答える
2

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));
    }
});
于 2012-10-17T19:15:15.607 に答える
0

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>
于 2012-10-03T06:25:39.940 に答える
0

次のようなスタイルへのリンクをサイトに追加させることができます。

新しいテーマをクリックすると、javascriptによってヘッドにリンクタグが追加され、リンクのui-lightness部分を次の名前のいずれかに置き換えることができます:http://jquery-ui.googlecode.com/svn/tags/1.8 .23 /themes/ これがお役に立てば幸い

于 2014-08-17T14:29:42.327 に答える