No.5ベストアンサー
- 回答日時:
こんにちは
>onclickのlocation harf=(支店名での選択したもの)+
>(年)+(季節)+(服のジャンル).html
>Javascriptは~~できれば使用したくありません。
onclickやlocation.hrefという時点で、すでにjavascriptを利用することになります。
#3様のアイデアは、現実的には相当に厳しいのではないかと思いますので、javascriptを利用した例です。
(サーバ側で行う方法もあると思いますが、質問者様にはハードルが高いのかも知れませんので)
リンク先のアドレスは、ご指定のような形式で、選択されたoptionのvalue値を連結した形にしてありますが、以下のサンプル程度でも、2×2×4×5=80通りのリンク先ができますので、対応するものを準備しておく必要がありますし、現状では全部同一ディレクトリになってしまうので、そちらの管理の方も面倒そうな気がします。
セレクトを選択してボタンクリックすると、指定のURLへジャンプしようとしますが、以下のHTMLだけでは当然ながら「File Not Found」のエラー表示になるでしょう。(リンク先のファイルが存在しないので)
でも、その状態で、ブラウザのアドレスバーを見れば遷移先のアドレスを確認することができると思います。
※ HTMLの文書構成を変えた場合は、スクリプトの修正が必要になることがあります。
※ 表示レイアウトの変更は(CSS)、自由に行っても動作に影響はないはずです。
<!DOCTYPE HTML>
<html lang="ja">
<head><title>Sample</title>
<style type="text/css">
#linker, #linker * { margin:0; padding:0; }
#linker {
width:24em; list-style-type:none;
display:flex; justify-content:space-between;
}
#linker li { text-align:center; line-height:1.4em; }
#linker button { padding:0.4em 0.8em; margin-top:0.5em; }
</style>
</head>
<body>
<ul id="linker">
<li><h5>支店名</h5>
<select>
<option value="tokyo">東京</option>
<option value="osaka">大阪</option>
</select>
</li>
<li><h5>年</h5>
<select>
<option value="2017">2017年</option>
<option value="2018">2018年</option>
</select>
</li>
<li><h5>季節</h5>
<select>
<option value="spring">春</option>
<option value="summer">夏</option>
<option value="autumn">秋</option>
<option value="winter">冬</option>
</select>
</li>
<li><h5>ジャンル</h5>
<select>
<option value="casual">カジュアル</option>
<option value="mode">モード</option>
<option value="saron">サロン</option>
<option value="street">ストリート</option>
<option value="surf">サーフ</option>
</select>
</li>
<li><button type="button" value="go">go</button></li>
</ul>
<script type="text/javascript">
document.querySelector("#linker button").addEventListener("click", function(){
var u = "", s = document.querySelectorAll("#linker select");
Array.prototype.map.call(s, function(e){ u += e.value; });
location.href = u + ".html";
}, false);
</script>
</body>
</html>
No.4
- 回答日時:
あ、ごめんなさい
4*4ではなく、4つのセレクトボックスの要素数の積分の要素+1ですね
仮に支店名=3・年=5・季節=4・服=10だとすると
600+1ページです
No.3
- 回答日時:
セレクトボックス4つの組み合わせで表示を切り替えたいということですね?
・サーバーサイドのプログラムを使わない
・javascriptをつかわない
となると相当面倒ですが、大丈夫ですか?
つまり4*4+未選択=17のコンテンツを同じページ内に埋め込む必要があります
No.2
- 回答日時:
javascriptなど記載できるwebサービスと契約しているのでしょうか?
そうでないなら最初からご希望の機能がそなわっている
サービスと契約する必要があるかもしれません
No.1
- 回答日時:
まずは初心者向けのHTMLの解説書を1冊入手されるとよいです。
本屋さんへ行くとそういった本が何種類かありますから中をパラパラと簡単に見て、ご自身にとって「これはわかりやすい」と感じる物にされるとよいでしょう。
もちろんネット上の本屋さんで内容を少し見ることが出来るようなところでもよいです。
また、自治体などの図書館で探してみるという方法もあります。
加えてネット上にある初心者向けのHTMLの解説サイトをあたられるのも方法です。Googleなどで「HTML 初心者」とか「HTML 入門」といった極簡単なキーワードで検索するといろいろみつかるはずです。
ちなみにプルダウンメニューを作成する際のタグを知りたいだけでしたら「HTML プルダウンメニュー」といったキーワードで検索すればHTMLタグの解説サイトなどにある該当箇所がヒットするかと思います。
参考まで。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・人生のプチ美学を教えてください!!
- ・10秒目をつむったら…
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・【大喜利】【投稿~9/18】 おとぎ話『桃太郎』の知られざるエピソード
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
テーブル内でドロップダウンメ...
-
<SELECT>タグの折り返し
-
セレクトメニューで2つの項目...
-
selectタグ内の特定のoptionの...
-
[html]ラジオボタンを使った診...
-
セレクトボックスから別窓にジ...
-
JSONで文字列が長い時
-
Application.ScreenUpdating = ...
-
16進の10進変換について
-
関数「exists」と「defined」の...
-
switch文のエラーについて
-
formで特定のinputを送信しない...
-
VBAでPDFのコピーとリネームを...
-
Perlで自分自身の関数名を知る...
-
Perlからメール送信で文字化け
-
python3について。
-
子windowsからsubmit()後にclos...
-
コンボボックスのtag情報の取得...
-
エクセルVBA シート名の部分一...
-
Sendmailの文字化けについて
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
文字の横にプルダウンを表示さ...
-
<SELECT>タグの折り返し
-
セレクトメニューで2つの項目...
-
テーブル内でドロップダウンメ...
-
セレクトボックスのselected属...
-
複数列を持ったリストボックス...
-
同じものを繰り返し表示させる
-
セレクトボックスから別窓にジ...
-
セレクトボックスの「選択して...
-
セレクトボックスである項目を...
-
プルダウンメニューの幅
-
SELECT OPTIONの中身をコピペ...
-
プルダウンリストの背景色の指定
-
selectタグ内の特定のoptionの...
-
ドロップダウンリストのselecte...
-
【プルダウンで選んでGOボタン...
-
セレクトメニューで選んだ値を...
-
セレクトボックスの中を一部隠...
-
プルダウンメニューのターゲッ...
-
HTMLでメディアプレイヤーの再...
おすすめ情報
分かりにくくてすいません。
やりたいことは
①4つのプルダウンselectタブをつかって選択
1つのHTMLで図のみを差し替える
(できれば同時にタイトルの支店名等もかえたい)
①が難しいようなら
②4つのプルダウンselectタブをつかって選択
各htmlへリンクする
です。「go」ボタンでは
onclickのlocation harf=(支店名での選択したもの)+(年)+(季節)+(服のジャンル).html
で実行できるようにしたいです。
具体的な記述方法をお願いします。
Javascriptはあるのではないかと思いますが
詳しくないのでできれば使用したくありません。
お願いします。