1

ページが読み込まれると、ランダムな色が生成され、「TESTCOLOUR」テキストとRSSフィードの見出しに適用されます。

http://jsfiddle.net/chrisloughnane/nqkH4/

問題は、RSSフィードの見出しの色が変わらないことです。

イベントを設定し、[テストカラー]をクリックすると、見出しの色が変わるので、動的に追加された要素に関係していると考えました。

私は.on()を見ましたが、それを機能させることができませんでした。

ページの読み込み時に見出しの色を変更するために必要なコードを誰かが投稿できますか?

tia

jQueryプラグインはFeedEkです:http: //jquery-plugins.net/FeedEk/FeedEk.html

コード

$(document).ready(function(){

    $('#divRss').FeedEk({
      FeedUrl : 'http://rss.cnn.com/rss/edition.rss'
    });

    var r = Math.floor(Math.random()*256);
    var g = Math.floor(Math.random()*256);
    var b = Math.floor(Math.random()*256);

    $('#example, .itemTitle a').css("color", getHex(r,g,b));

    $('#example').click(function() {

        $('.itemTitle a').css("color", getHex(r,g,b));

    });

    function intToHex(n){
        n = n.toString(16);
        if( n.length < 2) 
            n = "0"+n; 
        return n;
    }

    function getHex(r, g, b){
        return '#'+intToHex(r)+intToHex(g)+intToHex(b); 
    }

});

HTML

<div id="example">TEST COLOUR</div>
<div id="divRss"></div>

CSS

.feedEkList{width:450px; list-style:none outside none;background-color:#FFFFFF; border:1px solid #D3CAD7; padding:4px 6px; color:#3E3E3E;}
.feedEkList li{border-bottom:1px solid #D3CAD7; padding:5px;}
.feedEkList li:last-child{border-bottom:none;}
.itemTitle a{font-weight:bold; color:#4EBAFF; text-decoration:none }
.itemTitle a:hover{ text-decoration:underline }
.itemDate{font-size:11px;color:#AAAAAA;}

#example { font-weight: bold; cursor: pointer;}
4

1 に答える 1

2

-編集-

以下のコメントに応えて、timeoutは信頼できません。含まれているライブラリを拡張して、コールバック関数を使用できるようにしました。デフォルトはですalert('done')が、引数として渡して、好きなことを行うことができます。

更新されたフィドル:http://jsfiddle.net/nqkH4/8/

または、以下で説明するように、ターゲットdivのコンテンツをポーリングして、コンテンツに変更があるかどうかを確認できます。変更されている場合は、呼び出しが完了したことがわかります。

問題は、コンテンツがDOMにヒットし、スクリプトがそれをスタイル設定しようとするときにわずかな遅延があることだと思います。小さなで動作するようになりましたtimeout

 setTimeout(function () {
    var r = Math.floor(Math.random() * 256);
    var g = Math.floor(Math.random() * 256);
    var b = Math.floor(Math.random() * 256);
    var color = getHex(r, g, b);

    $('#example, .itemTitle a').css("color", color);

}, 50);

更新されたフィドル:http://jsfiddle.net/nqkH4/6/

于 2013-03-25T18:58:30.400 に答える