2

すべての iframe を検索し、iframe コードを画像に置き換えてから、変更された html を返すことを意味する関数に渡す HTML コードがいくつかあります。ただし、返された html の iframe コードは置き換えられないようです。交換を間違って参照しているだけだと確信していますが、私がやろうとしていることと同様の例をオンラインで見つけることができません。それらはすべて、ドキュメント全体または html がドキュメントに表示された後に検索を参照します。この HTML は、アプリケーションの要件によるものではありません。

注意: iframe コードを置き換える YouTube コードを既に生成しています。問題は、置換の実行にあります。

function article_youtube_convert(html) {
    //go throught the iframes for youtube and convert them to embed

    $(html).find('iframe').each(function(i) {
                     alert(this.src);
        //ok what we need to do here is check if it's youtube 
        src_youtube = this.src;
        if(src_youtube.indexOf('http://www.youtube.com')!=-1){
           //so now we need the video id 
           url_parts = src_youtube.split('/');

           youtube_id = url_parts[url_parts.length-1];

           url_parts = youtube_id.split('?');
           youtube_id = url_parts[0];

           youtube_link = 'http://www.youtube.com/watch?v='+youtube_id;
           img_youtube = '<a id="tempvid" href="'+youtube_link+'"><img src="http://img.youtube.com/vi/'+youtube_id+'/0.jpg"/><br />View YouTube Video</a>';

            $(this).replaceWith(img_youtube);


                     //alert(document.getElementById('tempvid').innerHTML);  
        }
    });
    return html;


}

アップデート

以下のように、outerHTML アプローチを使用して、テキストを変数内の新しい置換テキストに置き換えることにしました。問題なく完全なソースに警告しますが、それでも置き換えられません。

jQuery.fn.outerHTML = function(s) {
    return s
    ? this.before(s).remove()
    : jQuery("<p>").append(this.eq(0).clone()).html();
};


function article_youtube_convert(passed) {
    //go throught the iframes for youtube and convert them to embed
    //alert('inside');
    newhtml = passed;
    //alert(newhtml);
    $(newhtml).find('iframe').each(function(i) {
                     //alert(this.src);
        //ok what we need to do here is check if it's youtube 
        src_youtube = this.src;
        if(src_youtube.indexOf('http://www.youtube.com')!=-1){
           //so now we need the video id 
           url_parts = src_youtube.split('/');
                                   alert('youtube vid');
           youtube_id = url_parts[url_parts.length-1];

           url_parts = youtube_id.split('?');
           youtube_id = url_parts[0];

           youtube_link = 'http://www.youtube.com/watch?v='+youtube_id;
           img_youtube = '<a id="tempvid" href="'+youtube_link+'"><img src="http://img.youtube.com/vi/'+youtube_id+'/0.jpg"/><br />View YouTube Video</a>';
                                   alert('alert: '+$(this).outerHTML());
                                   sourcethe = $(this).outerHTML();
                                   passed.replace(sourcethe,img_youtube);
            //$(this).replaceWith(img_youtube);
                                   //alert($(this));


                     //alert(document.getElementById('tempvid').innerHTML);  
        }
    });
    alert(passed);
    return passed;


}
4

3 に答える 3

1

David、私は簡単なテストを行い、3つの要素を含む単純なHTMLページを作成iframeし、コードをコピーしました。iframeを<div id="test">要素でラップし、と呼びarticle_youtube_convert ("div#test");ました。iframeは完璧に交換されました。

<div id="test">
  <iframe width="560" height="315" src="http://www.youtube.com/embed/Z5y-UIjhjuM" frameborder="0" allowfullscreen></iframe>
  <iframe width="560" height="315" src="http://www.youtube.com/embed/Z5y-UIjhjuM" frameborder="0" allowfullscreen></iframe>
  <iframe width="560" height="315" src="http://www.youtube.com/embed/Z5y-UIjhjuM" frameborder="0" allowfullscreen></iframe>
</div>

正しいhtmlコンテキストをarticle_youtube_convert関数に渡していますか？

于 2012-04-25T13:03:18.863 に答える
1

その関数から実際に必要なものを返していないようです...

メソッドを実際に変更することはありませんhtml。メソッドを使用して、破棄されるものを実行し、入力したものを返すだけです。

あなたが最もやりたいことは、次のようなものです

var jqHtml = $(html);
...Do stuff to modify jqHtml...
return jqHtml.html();

私が確信が持てず、テストしていないことの1つは、 .html() が必要なものを返すかどうかです。ドキュメントは要素innerHTMLプロパティを使用すると言っていますが、それが文字列から構築されたjqueryオブジェクトで正しいことを与えるかどうかはわかりません（そうすべきだと思います）。

とにかく、それはあなたの基本的な問題です.htmlをまったく変更していません。必要に応じて更新できる文字列への参照ではなく、文字列$(html)のコピーを取得しています。html

于 2012-04-25T13:32:59.013 に答える
0

私はあなたが欲しいと思います

  url_parts = youtube_id.split('?');
  youtube_id = url_parts.pop();

ただし、 にはyoutube_idが含まれるためv=、次のように実行できることに注意してください。url_parts.pop().substring(2)

于 2012-04-25T11:40:12.617 に答える