URL ハッシュを使用して特定のタブでページを開く

Question

確かに、私はハッシュに慣れていないので、これについて少し迷っていますが、これが私の問題の解決策になるかもしれないと思うので、ここにいる誰かがもう少し洞察を持っていることを願っています。複数の「タブ」(ボタンをクリックするまで情報を隠す div と、ボタンをクリックするまで他のすべての情報を隠す div) を持つ Web ページがあり、別の Web ページから特定のタブを開くことができるようにしたいです.< ;/p>

これは前の Web ページのスケルトンです。定期的にページに移動すると、デフォルトで最初の div が表示されます。

<div id="first" class="commission">
コンテンツ
</div>

<div id=" Second" class="commission" style="display:none;">
コンテンツ
</div>

<div id="third" class="commission" style="display:none;">
コンテンツ
</div>

このページには、これらの div を切り替えるためにクリックできるボタンがあります。

<button class="commissiontab" onclick="commissionType(event, 'first')">first</button>
<button class="commissiontab" onclick="commissionType(event, 'second')">Second</button>
<button class="commissiontab" onclick="commissionType(event, 'third')">3 番目</button>

これらを切り替えるための JavaScript は次のとおりです:

function CommissionType(evt, CommissionName) {
  var i,commissiontab;
  var x = document.getElementsByClassName("手数料");
  for (i = 0; i < x.length; i ) {
    x[i].style.display = "なし";
  }
  コミッションタブ = document.getElementsByClassName("コミッションタブ");
  for (i = 0; i < x.length; i ) {
    Commissiontab[i].className = Commissiontab[i].className.replace("選択済み", "");
  }
  window.scrollTo({ トップ: 0, 動作: 'スムーズ' });
  evt.currentTarget.className = "選択済み";
  document.getElementById(commissionName).style.display = "グリッド";
}

どういうわけか、これらのボタンを別のページ (「index.html」) に配置したいのですが、「3 番目」をクリックすると、代わりに新しいページ (「commissiontypes.html」) に移動します。デフォルトの「最初」。

ハッシュの使用以外に他の解決策がある場合は、ぜひお聞きしたいです。詳しく見ていただきありがとうございます。

Answer 1

'commission' クラスを使用して最初はすべての要素を非表示にし、その後、location.hash に基づいてページが読み込まれるときにそのうちの 1 つだけを表示することができます。このようにして、commissiontypes.html (および Commissiontypes.html#first) は最初の div を表示し、commissiontypes.html#second は 2 番目の div を表示します。

リーリー

(あるいは、このセクションを示すためにクエリ パラメーターを使用することも検討できます。)