図のような Web クライアントを作りたいのですが、左側(cè)のナビゲーションをクリックすると、更新せずに右側(cè)のページにジャンプします。
つまり、右側(cè)のページが切り替わると、メインのルーティングが行われます。アドレスは変更されません(例:index.html/# ページ 1、マスターに指導(dǎo)を求めるか、研究文書を提供してください)
左側(cè)の5つのナビゲーションに対応し、右側(cè)に5つの異なるコンテンツを書き込むことができます。左右の対応するブロックをクリックすると表示され、他のブロックは非表示になります。いわゆるタブ切り替えです。
URLを変更するには、左ナビゲーションのペリフェラルaタグのhref屬性に「#block1」「#block2」などを記述します。
基本的なコードは次のとおりです:
上記の回答はすべてタブを使用しています。これが質(zhì)問者が望んでいることかどうかはわかりません
フロントエンド (index.html):
リーリーバックエンド (server.php):
リーリー言語やフレームワークに制限はありませんか?更新せずにコンテンツを切り替える方法について簡単に説明します:
タブの切り替えはcss
簡単に実裝することも、jsやjqを使用して実裝することもできます。
更新せずにデータとコンテンツを更新、Ajax実裝
ルートジャンプ、vue
和angular
等框架都可以實現(xiàn)
但是題主給的樣例是比較常見的tab切換
サンプル、これを使用して達成することをお勧めします
:target疑似要素で実裝したタブ切り替えです。
http://codepen.io/hzz/pen/RVNbyz