jqueryを使用してクリックしたときに表示された同じイメージの新しいページを開く方法

Question

私は比較的新しいjavascriptを使用しており、この問題を説明する最善の方法を探しています。それはstuffedd.htmlページにリダイレクトされますのimgをクリックすると

<div class="col-md-4"> 
     <a href="stuffedd.html"><img src=""></a> 
     <a href="stuffedd.html"><img src=""></a> 
     <a href="stuffedd.html"><img src=""></a> 
</div> 

：私はこれを持っている誰もが私にこの

上の助言を与えることができることを望みます。しかし、これは画像を持つ2列を含んでいます。縦のサムネイル列と大きな列の中列。このよう

：

<div class="middle containerscroll"> 
    <img src="" id="Mdrie" class="img-responsive "> 
    <img src="" id="Mvier" class="img-responsive "> 
    <img src="" id="Mvijf" class="img-responsive "> 
</div> 
div class="col-md-9 hidden-xs hidden-sm"> 
    <img src="" id="drie" class="img-responsive single"> 
    <img src="" id="vier" class="img-responsive single"> 
    <img src="" id="vijf" class="img-responsive single"> 
</div> 

は、私がこれまでjQueryを使ってこれを得た：

私は（すべて私は2番目のdivでクリック画像とstuffedd.htmlをオープンにするにはどうすればよい

$(document).ready(function(){ 

"use strict"; 
$(".single").hide(); 

$("#Mdrie").on('click',function() {  
$('#drie').toggle(); 
$(".single").not('#drie').hide(); 

}); 

クラス.singleの画像） は私のように私が記入変数を宣言してください：

$("var").show(); 

ウェブサイトは：www.damondebacker.comが必要です。

Answer 1

私は質問を理解していれば、2ページ目は、前のページでクリックされた内容をよく認識する必要があり、画像を識別するURLにいくつかの識別子を追加することを検討：

<a href="stuffedd.html#Mdrie"><img src=""></a> 

次に、2ページ目を持っていますそれを抽出する場所。あなたがURLにそれを必要としない場合は、Cookieを設定するか、LocalStorageオブジェクトを使用することができます。

Answer 2

URLの最初のページに画像のIDを転送してください。画像をクリックするとリンクは/stuffed.html?id=drieのようになります。後であなたの詰まったサイトでは、変数内のjqueryでパラメータを取得し、正確にこの画像を表示します。 Here is a short tutorial for URL Parameters and jQuery