2017-01-13 6 views
1

私のウェブサイトはiframeを使用してdiv要素内のコンテンツを読み込みます。 私の問題は、ページをリフレッシュしてメインページにリダイレクトするときです。iframeページをリフレッシュすると、同じページではなくメインページにリダイレクトされます

ここはコードの一部です。

 <a href="promotion.jsp">Promotion</a> 

ここに私が使用したjavascript関数があります。

$(document).ready(function(){ 

     var url; 
     $('a').click(function(e){ 

      e.preventDefault(); 
      url = $(this).attr('href'); 
      if(undefined != url){ 
       window.frames["page-wrapper"].src = url; 
       clickFront(); 
      } 
     }); 

     $("button").click(function() { 
      checkUrlandId(url,this.id);   
     }); 

    }); 

clickFront()有効にして、いくつかの上部のメニューバーのボタンの機能を無効にする機能です。

メニュー項目([承認])をクリックしたときにページが変更されました。そのページがリフレッシュされると、現在のページではなくメインページにリダイレクトされます。

ここに2つのスクリーンショットがあります。最初はメニュー項目をクリックする前、もう1つはメニュー項目をクリックした後です。 URLが変更されていないメニュー項目をクリックした後

First Image

Second Image

私は、これを行うためのURLを保存するためにcookieまたはjavascript localstorageを使用できることをお読みください。誰かが私を助けることができる...私はjsの初心者です。

+0

クリックすると、新しいページがロードされます* * this ** Default ** behavior –

+1

私は新しいページをロードしたくありません。サイドメニューは静的ですが、ページの右側は動的です –

+0

リフレッシュを許可するにはクッキーまたはハッシュを使用する必要があります – mplungjan

答えて

0

私はとにかく
window.frames["page-wrapper"].location = url;

するwindow.frames["page-wrapper"].src = url;を期待します。あなたがリフレッシュしてブックマークを生き残るためにiFrameの変更が必要な場合は、ページ内のハッシュを使用する必要があります。

$(function(){ 
    var url = location.hash?decodeURIComponent(hash.substring(1)):""; 
    if (url) window.frames["page-wrapper"].location = url; 
    $('a').click(function(e){ 
     e.preventDefault(); 
     url = $(this).attr('href'); 
     if(undefined != url){ 
      location.hash=encodeURIComponent(url); 
      window.frames["page-wrapper"].location = url; 
      clickFront(); 
     } 
    }); 

}); 

URLが外部にある場合、あなたは本当にターゲットを必要としています。あなたは**を防止しない限り、

のlocalStorage

$(function(){ 
    var url = localStorage.getItem("url"); 
    if (url) window.frames["page-wrapper"].location = url; 
    $('a').click(function(e){ 
     e.preventDefault(); 
     url = $(this).attr('href'); 
     if(undefined != url){ 
      window.frames["page-wrapper"].location = url; 
      localStorage.setItem("url",url); 
      clickFront(); 
     } 
    }); 

}); 
+0

上記の方法を使用すると、サイドメニューが表示されなくなります。私はここでiframeを使用しています。つまり、私のサイドメニューは変わらず、他の部分も変更されています。 –

+0

これは機能しません。このURLは変更されていますが、ページはロードされていません... –

+0

私はそれを実際に見て、コンソールを確認する必要があります – mplungjan

0

以下のサンプルを見て、アンカータグのすべてが期待どおりに動作します

var anchors = document.querySelectorAll('a'); 
 
Array.prototype.forEach.call(anchors, function(a) { 
 
    a.onclick = function(e) { 
 
    e.preventDefault(); 
 
    window.frames.frame1.src = a.getAttribute('href'); 
 
    } 
 
});
<ul> 
 
    <li> 
 
    <a href="http://stackoverflow.com">Stackoverflow main page</a> 
 
    </li> 
 
    <li> 
 
    <a href="http://stackoverflow.com/users/2308005/medet-tleukabiluly?tab=profile">My profile</a> 
 
    </li> 
 
    <li> 
 
    <a href="http://stackoverflow.com/questions/41629581/node-js-obtain-access-token">Question: Node.js obtain access token</a> 
 
    </li> 
 
</ul> 
 
<hr /> 
 
<iframe id="frame1" width="500" height="200" src="http://stackoverflow.com/questions/41629578/when-iframe-page-refreshes-it-redirect-to-the-same-page-not-to-the-main-page"></iframe>

+0

私は#ページラッパーフレーム内に外部HTMLファイルをロードする必要があります –

関連する問題