-2

複数のリンクが含まれるテキストがあります。1つのリンクは次のようになります

<a href="http://www.mydomain.com/files/test1.pdf" target="_blank">My link</a>

divまず、すべてのタグの周りにタグをラップしたいと思いますが、がで始まっているhref場合に限ります。したがって、上記のリンクは（そのプレフィックスで始まるため）次のようになります。hrefhttp://www.mydomain.com/files/

<div class="myLink">
   <a href="http://www.mydomain.com/files/test1.pdf" target="_blank">My link</a>
</div>

次に、ファイル拡張子（の末尾の文字）に応じてhref、リンクの前に画像を追加して、次のようにします。

<div class="myLink">
   <img src="pdf_file_icon.png" alt="File type icon" />
   <a href="http://www.mydomain.com/files/test1.pdf" target="_blank">My link</a>
</div>

オプションで、リンクの後にテキストを追加して、最終バージョンが次のようになるようにします。

<div class="myLink">
   <img src="pdf_file_icon.png" alt="File type icon" />
   <a href="http://www.mydomain.com/files/test1.pdf" target="_blank">My link</a>
   <span class="fileSize">1.3 Mb</span>
</div>

PHPとJavaScript/jQuery の両方のソリューションが必要です（セレクター機能があるため、jQueryの方が簡単だと思いますか？）。

私が取得したいのは、通常のテキストリンクからこのようなものに移動することです（ファイルサイズを気にしないでください。事前に計算されているため、他の通常の/ダミーのテキストと同じです）

ここに画像の説明を入力してください

編集＃1

これがPHPでの私の試みです

$regexp = "<a\s[^>]*href=(\"??)(http:\/\/www\.mydomain\.com\/files\/[^\" >]*?)\\1[^>]*>(.*)<\/a>";
$text = preg_replace("/$regexp/siU", "<div class=\"fileAttachment\"><img src=\"pdf_file_icon.png\" alt=\"File type icon\" /><a href=\"$2\" target=\"_blank\">$3</a></div>", $text);

しかし、ファイル拡張子をすぐに確認し、それに応じて適切な画像（pdf_file_icon.png）を挿入する方法がわかりませんか？

4

3 に答える 3

1

これがphpソリューションです。自分でファイルサイズを設定する必要があります。簡単に追加できます。

私が preg replace を使用しない理由は、これにより可読性が保たれ、100kb を超えるテキスト ファイルを翻訳する場合を除き、十分に高速であり、デバッグが容易になるからです。

$rawhtml = 'your html file here<a href="http://www.go.com">test</a> and <a href="http://www.do.com/where.pdf">test</a>';
// Explode at every <a tag
$explodedhtml = explode("<a ",$rawhtml);
// Loop through everything
foreach($explodedhtml as $piece)
    {
    // Does our piece contain href?
    if(strpos($piece,"href=") !== false)
        {
            // Extract the url
        $href = substr($piece,strpos($piece,'href=')+6,((strpos($piece,'"',7))-(strpos($piece,'href=')+6)));
        // easy debug
        //echo $href . "<BR>";
            // Does it end in pdf?
        if(substr($href,strlen($href)-4,strlen($href)) === ".pdf")
            {
                    // add all the stuff we want for a pdf file
            $filezie = filsizecomputingfunction();// Put here your filesize thingymejig
            $piece = implode("</a>$filesize</div>",explode("</a>",$piece));// Add filesize here
            $pieces[] =  '<div class="myLink"><img src="pdf_file_icon.png" alt="File type icon" /><a '.$piece;
            }
            // It isn't a pdf...
        else
            {
                    //Just add our closing divs... after the closing tag
            $piece = implode("</a></div>",explode("</a>",$piece));
                    // add to array, add div class and our opening tag
            $pieces[] =  '<div class="myLink"><a '.$piece;          
            }
        }
    // Nothing to detect, just shove it in our array.
    else
        {
        $pieces[] = $piece;
        }
    }
Return to our basic variable so we can work with it in the displaying thingymejig.
$rawhtml = implode('',$pieces);
于 2012-08-24T09:22:47.170 に答える
1

少し退屈なので、jQuery の実装を次に示します。

$('a[href^="http://www.mydomain.com/files"]')
    .each(function() {
        var t = $(this);
        var href = $(this).attr('href');
        var ext = href.substring(href.lastIndexOf('.') + 1);
        t.wrap('<div class="mylink"></div>');
        switch (ext) {
            case 'pdf': 
               t.before('<img src="pdf_file_icon.png" alt="File type icon" />'); 
               break;
            // Add more types here
        }
        t.after('<span class="fileSize">1.3 Mb</span>');
    }
);​

http://jsfiddle.net/AK9nG/

確かにPHPでそれを行うには、HTMLを直接編集するだけですか?

于 2012-08-24T09:09:43.620 に答える
0

ファイルアイコンを要素自体の背景画像として使用し、css を使用してファイル拡張子に応じてスタイルを適用できます。

a[href$=".pdf"] {
  display: block;
  border: 1px solid salmon;
  background: lighblue url('pdf-icon.png') no-repeat;
  /* etc... */
}
于 2012-08-24T09:05:34.670 に答える