2012-01-18 12 views
1

私のWebページは、AJAX呼び出しによってXMLからコンテンツを取得します。そのXMLからURLを取得し、それを使用してページ上に要素を作成します。 同じタグの画像またはswfを表示

しかし、そのURLは次のように見ることができます:

  • http://something/something.jpg
  • またはhttp://something/something.swf

これは、それが画像ファイルであってもよく、または.swfファイルできることを意味、私はできないのですそのイメージまたは.swfファイルを同じタグに表示します(これも動的に作成されます)。

イメージと.swfファイルの両方を同じタグに表示する方法がわかりません。これをどうすれば解決できますか?

答えて

2

タグを作成する前にURLを確認してみませんか?正規表現で

var url  = 'http://something/something.swf'; 
var matches = url.match(/(swf|jpg)$/i); 

if (matches.length > 0) { 
    var type = matches[0].toLowerCase(); 
    /* create the img or embed tag, based on `type` */ 
} 

iが、それは関係なく、例一致します(それは同様に「something.SWF」と一致します)とtoLowerCaseは必ず私たちはそれを比較することができます。そうのようなあなたは、regular expressionを使用することができます小文字の文字列です(例:if (type === 'swf') { })。

今、あなたはこのように、正しいタグを作成するために、結果を使用することができます。

var url  = /* extracted from XML, e.g.: */ 'http://something/something.swf'; 
var matches = url.match(/(swf|jpg)$/i); 

if (matches.length > 0) { 
    var type = matches[0].toLowerCase(); 
    var tag; 

    // Create the correct tag: 
    if (type === 'swf') { 
     tag = $('<embed type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer" />'); 
    } 
    else if (type === 'jpg') { 
     tag = $('<img />'); 
    } 

    // Set the src and append to <body>: 
    if (tag !== undefined) { 
     tag.attr('src', url); 
     tag.appendTo('body'); 
    } 
} 

この例では、テストされていないことに注意してください。たとえば、<embed>タグで属性がheightwidthに設定されている必要があります。


NB:全体のマッチを含む配列、および任意の整合グループを返しmatch。この場合、配列は['jpg', 'jpg']のようになります。これはグループ(jpg|swf)が保存され、完全一致するためです。このような動作を防止する必要がある場合は、非キャプチャグループ((?:jpg|swf))を使用してグループを保存することはできません。

+2

また、swfファイルをイメージよりも埋め込むためのタグを生成する必要があることにも注意してください。 – rekire

+1

@ rekireのポイントを示す例を追加しました。 – PPvG

+0

可能であれば、私は2回upvote ;-) – rekire