JavaScript/jQueryを使用してリンクのURLパラメータ値を置き換えますか？

Question

私のCMSのライトボックススタイルのフォトギャラリーは、以下のようなコードを出力します。 2つのサムネイルのコードを提供しました。

"m"と "s"のパラメータ値は、常に "150"と "true"になります。私はそれをm = 250とs = falseに変更したいと思います。

JavaScriptとjQueryの新機能です。提案がある場合は、コードをどこに置くかを教えてください。ありがとうございました。ドキュメント準備ハンドラで

<div class="thumbTight MainContent"> 
    <div class="thumbContents"> 
     <a href="/PhotoGallery/banana.jpg" rel="lightbox[2065379]" title="Banana"> 
      <img src="/ResizeImage.aspx?img=/PhotoGallery/banana.jpg&amp;m=150&amp;s=true" alt="Banana" /> 
     </a> 
     <div class="description" style="display: none;"></div> 
    </div> 
</div> 

<div class="thumbTight"> 
    <div class="thumbContents"> 
     <a href="/PhotoGallery/cantaloupe.jpg" rel="lightbox[2065379]" title="Cantaloupe"> 
      <img src="/ResizeImage.aspx?img=/PhotoGallery/cantaloupe.jpg&amp;m=150&amp;s=true" alt="Cantaloupe" /> 
     </a> 
     <div class="description" style="display: none;"></div> 
    </div> 
</div> 

Answer 1

、サムネイル（thumbContentsクラスでのdiv内の画像）を反復し、必要な置換を持つ元src属性にsrc属性を割り当てるためにeachを使用しています。

$(function() { 
    $('.thumbContents img').each(function() { 
     var $img = $(this); 
     $img.attr('src', $img.attr('src').replace(/m=150/,'m=250').replace(/s=true/,'s=false')); 
    }); 
}); 

Answer 2

このjQueryは、ページがロードされた後に実行できます。画像は異なるURLで読み込みを開始し、コードが実行されて画像のURLが変更され、新しいURLがロードされて表示されます。最初に表示されるのを防ぐためにクライアント側で行うことはできません。実際にCSSを使用しないと、画像は最初は非表示になり、目的のURLを設定した後にのみ表示されます。

$(".thumbTight img").each(function() { 
    this.src = this.src.replace(/m=150/, "m=250").replace(/s=true/, "s=false"); 
}); 

デモはhttp://jsfiddle.net/jfriend00/UdnFE/で見ることができます。