1

JavaScriptで正規表現を使用してdivのすべてのインスタンスを通過する方法について質問がありますclass="audioplayer"。次に、a）デスクトップコンピューターの場合は下部にダウンロードリンクを追加するか、b）全体をHTML5オーディオプレーヤーに置き換えます。 （URLを使用）iPhone、iPad、iPodなどの場合。メインのHTMLは次のとおりです。

<div class="audioplayer">
<embed src="http://www.site.com/audioplayer.swf" wmode="transparent" allowscriptaccess="never" allowfullscreen="false" scale="noscale" flashvars="sourceId=4&amp;mp3url=http://brightcove.vo.llnwd.net/pd16/media/44692000001/44692000001_1745411065001_LEOG-18.mp3&amp;autoplay=false&amp;mp3title=THE LEAGUE OF EXTREMELY ORDINARY GENTLEMEN: Conned Out&amp;color=273643" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/products/flashplayer" height="139" width="356"> 
</embed>
</div>

私が読んだものから、この正規表現は上記のテキストからすべてのURLを引き出します：

/\b((?:https?:\/\/|www\d{0,3}[.]|[a-z0-9.\-]+[.][a-z]{2,4}\/)(?:[^\s()<>]+|\(([^\s()<>]+|(\([^\s()<>]+\)))*\))+(?:\(([^\s()<>]+|(\([^\s()<>]+\)))*\)|[^\s`!()\[\]{};:'\"\\.,<>?\u00AB\u00BB\u201C\u201D\u2018\u2019]))/i

そして、これは私が考えていたものの最初のモックアップです：

jQuery(document).ready(function($) {
    $("div.audioplayer").each(function () {
        var regex = /\b((?:https?:\/\/|www\d{0,3}[.]|[a-z0-9.\-]+[.][a-z]{2,4}\/)(?:[^\s()<>]+|\(([^\s()<>]+|(\([^\s()<>]+\)))*\))+(?:\(([^\s()<>]+|(\([^\s()<>]+\)))*\)|[^\s`!()\[\]{};:'\"\\.,<>?\u00AB\u00BB\u201C\u201D\u2018\u2019]))/i;
            if(navigator.platform == 'iPad' || navigator.platform == 'iPhone' || navigator.platform == 'iPod') {
                $(this).empty();
                $(this).append('<audio src="'+regex+'"controls>');
            };
            else(){
                $(this).append('<p></p><p></p><p class="audioembed">Click here to <a href="'+regex+'">Download MP3</a></p>');
            };
    });
});

しかし、明らかに私はいくつかの重要なステップを見逃しています：

1）div.audioplayer内にあるものに対してのみ正規表現を実行し、直後のURLのみを返したいmp3url=。

2）返されたURLを取得して変数に配置し、追加部分でその特定の変数を呼び出す方法について、明らかに何かが欠けています。

あなたが私に与えることができるどんな助けでも、またはあなたが私を正しい方向に向けることができれば、ありがたいです。

4

2 に答える 2

2

属性を読んでみてください。

jQuery(document).ready(function($) {
    $(".audioplayer").each(function() {
        var mp3 = $("embed", this).attr("flashvars").match(/mp3url=(.*?)(?:&|$)/)[1];
        if (navigator.platform == 'iPad' || navigator.platform == 'iPhone' || navigator.platform == 'iPod') {
            $(this).empty();
            $(this).append('<audio src="' + mp3 + '"controls>');
        } else {
            $(this).append('<p></p><p></p><p class="audioembed">Click here to <a href="' + mp3 + '">Download MP3</a></p>');
        }
    });
});

デモ： http： //jsfiddle.net/mNJXc/

于 2012-07-30T07:31:17.627 に答える
0

正規表現を使用せずにDOMノードをトラバースできます。適切なセレクターを使用して、jQueryまたはjavascriptで直接実行できます。参照： http ：//api.jquery.com/attr/

これを使用して「flashvars」属性を取得し、その属性で文字列処理を実行してURLを取得します。

于 2012-07-30T07:28:14.350 に答える