質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

1回答

1619閲覧

javascript で自動的にoption項目を増やす設定

k.nomura

総合スコア12

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2016/11/27 11:46

編集2016/11/27 12:08

javascript,html

1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2<html> 3<head> 4<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5<title>無題ドキュメント</title> 6<script type="text/javascript"> 7var toyota=new Array("","86","bB","FJクルーザー","GS","IQ","MR-2","MR-S","RAV-4","SAI","WiLL Vi","WiLL Vs","WiLL サイファ","アイシス","アクア","アバロン","アベンシスセダン","アベンシスワゴン","アリオン","アリスト","アルテッツァ","アルテッツァジータ","アルデオ","アルファード","アレックス","イスト","イプサム","ウィッシュ","ウィンダム","ヴァンガード","ヴィッツ","ヴェルファイア","ヴェロッサ","ヴォクシー","ヴォルツ","エスクァイア","エスティマ","エスティマエミーナ","エスティマルシーダ","オーパ","オーリス","オリジン","カムリ","カムロード","カリーナ","カリーナED","カリーナサーフ","カルディナ","カルディナバン","カローラ","カローラⅡ","カローラアクシオ","カローラセレス","カローラバン","カローラフィールダー","カローラランクス","カローラルミオン","カローラワゴン","ガイア","キャミ","クイックデリバリー","クラウン","クラウン コンフォート","クラウンエステート","クラウンマジェスタ","クラウンワゴン","クラシック","クルーガー","クレスタ","グラシア","グラシアワゴン","グランドハイエース","グランビア","コースター","コルサ","コロナ","サイノス","サクシード","シエンタ","スープラ","スターレット","スパーキー","スパシオ","スプリンター","スプリンターカリブ","スプリンタートレノ","スペイド","セラ","セリカ","セルシオ","センチュリー","ソアラ","ターセル","タウンエース","タウンエーストラック","タウンエースノア","タウンエースバン","タンドラ","ダイナ","ダイナトラック","チェイサー","ツーリングハイエース","デュエット","デリボーイ","トヨエース","トレノ","ナディア","ノア","ハイエース","ハイエースコミューター","ハイエーストラック","ハイエースバン","ハイラックス","ハイラックスサーフ","ハイラックストラック","ハリアー","パッソ","パッソセッテ","ビスタ","ビスタアルデオ","ビスタアルデオワゴン","ピクシスエポック","ピクシススペース","ピクシストラック","ピクシスバン","ピクシスメガ","ファンカーゴ","フォークリフト","ブレイド","ブレイド","ブレビス","プラッツ","プリウス","プリウスα","プレミオ","プログレ","プロナード","プロボックス","ベルタ","ポルテ","マークX","マークXジオ","マークⅡ","マークⅡクオリス","マークⅡバン","マークⅡブリット","マークⅡワゴン","メガクルーザー","ラッシュ","ライトエース","ライトエーストラック","ライトエースノア","ライトエースバン","ライトエースワゴン","ラウム","ラクティス","ランドクルーザー","ランドクルーザーシグナス","ランドクルーザープラド","レクサス","レクサス","レジアス","レジアスエース","レジアスエースバン","レビン"); 8var lexus=new Array("","CT","GS","HS","IS","IS-F","ISコンバーチブル","LS","RX","SC"); 9 10function carSet(){ 11 //オプションタグを連続して書き換える 12 for ( i=1; i<selbox.car.length; i++ ){ 13 //選択したリーグによって分岐 14 switch (document.selbox.maker.value){ 15 case "": document.selbox.car.options[i].text="";break; 16 //case "トヨタ": document.selbox.car.options[i].text=toyota[i];break; 17 case "トヨタ": document.selbox.car.options[i].text=toyota[i];break; 18 case "レクサス": document.selbox.car.options[i].text=lexus[i];break; 19 } 20 } 21 //車種名のセレクトボックスの選択番号を0にする 22 document.selbox.car.selectedIndex=0; 23} 24</script> 25</head> 26 27<body> 28 29<form name="selbox"> 30<p>メーカー</p> 31<select name="maker" onchange="carSet()"> 32<option value="" data-value="">選択してください</option> 33<option value="トヨタ" data-value="001">トヨタ</option> 34<option value="レクサス" data-value="015">レクサス</option> 35</select> 36 37<p>車種</p> 38<select name="car"> 39<option value="">選択してください</option> 40<option value=""></option><option value=""></option><option value=""></option><option value=""></option><option value=""></option><option value=""></option><option value=""></option><option value=""></option><option value=""></option><option value=""></option> 41</select> 42</form> 43 44</body> 45</html> 46

###前提・実現したいこと
javascriptの項目で、自動的にoptionを増減するようにしたい。
どうか、ご教授お願いします。m(_ _"m)

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

optionを削除して、追加してやれば良いと思います。

HTML

1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 2<html> 3<head> 4<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5<title>無題ドキュメント</title> 6<script type="text/javascript"> 7/* 8var toyota=new Array("","86","bB","FJクルーザー","GS","IQ","MR-2","MR-S","RAV-4","SAI","WiLL Vi","WiLL Vs","WiLL サイファ","アイシス","アクア","アバロン","アベンシスセダン","アベンシスワゴン","アリオン","アリスト","アルテッツァ","アルテッツァジータ","アルデオ","アルファード","アレックス","イスト","イプサム","ウィッシュ","ウィンダム","ヴァンガード","ヴィッツ","ヴェルファイア","ヴェロッサ","ヴォクシー","ヴォルツ","エスクァイア","エスティマ","エスティマエミーナ","エスティマルシーダ","オーパ","オーリス","オリジン","カムリ","カムロード","カリーナ","カリーナED","カリーナサーフ","カルディナ","カルディナバン","カローラ","カローラⅡ","カローラアクシオ","カローラセレス","カローラバン","カローラフィールダー","カローラランクス","カローラルミオン","カローラワゴン","ガイア","キャミ","クイックデリバリー","クラウン","クラウン コンフォート","クラウンエステート","クラウンマジェスタ","クラウンワゴン","クラシック","クルーガー","クレスタ","グラシア","グラシアワゴン","グランドハイエース","グランビア","コースター","コルサ","コロナ","サイノス","サクシード","シエンタ","スープラ","スターレット","スパーキー","スパシオ","スプリンター","スプリンターカリブ","スプリンタートレノ","スペイド","セラ","セリカ","セルシオ","センチュリー","ソアラ","ターセル","タウンエース","タウンエーストラック","タウンエースノア","タウンエースバン","タンドラ","ダイナ","ダイナトラック","チェイサー","ツーリングハイエース","デュエット","デリボーイ","トヨエース","トレノ","ナディア","ノア","ハイエース","ハイエースコミューター","ハイエーストラック","ハイエースバン","ハイラックス","ハイラックスサーフ","ハイラックストラック","ハリアー","パッソ","パッソセッテ","ビスタ","ビスタアルデオ","ビスタアルデオワゴン","ピクシスエポック","ピクシススペース","ピクシストラック","ピクシスバン","ピクシスメガ","ファンカーゴ","フォークリフト","ブレイド","ブレイド","ブレビス","プラッツ","プリウス","プリウスα","プレミオ","プログレ","プロナード","プロボックス","ベルタ","ポルテ","マークX","マークXジオ","マークⅡ","マークⅡクオリス","マークⅡバン","マークⅡブリット","マークⅡワゴン","メガクルーザー","ラッシュ","ライトエース","ライトエーストラック","ライトエースノア","ライトエースバン","ライトエースワゴン","ラウム","ラクティス","ランドクルーザー","ランドクルーザーシグナス","ランドクルーザープラド","レクサス","レクサス","レジアス","レジアスエース","レジアスエースバン","レビン"); 9var lexus=new Array("","CT","GS","HS","IS","IS-F","ISコンバーチブル","LS","RX","SC"); 10*/ 11 12var data={ 13"":[], 14"トヨタ":["","86","bB","FJクルーザー","GS","IQ","MR-2","MR-S","RAV-4","SAI","WiLL Vi","WiLL Vs","WiLL サイファ","アイシス","アクア","アバロン","アベンシスセダン","アベンシスワゴン","アリオン","アリスト","アルテッツァ","アルテッツァジータ","アルデオ","アルファード","アレックス","イスト","イプサム","ウィッシュ","ウィンダム","ヴァンガード","ヴィッツ","ヴェルファイア","ヴェロッサ","ヴォクシー","ヴォルツ","エスクァイア","エスティマ","エスティマエミーナ","エスティマルシーダ","オーパ","オーリス","オリジン","カムリ","カムロード","カリーナ","カリーナED","カリーナサーフ","カルディナ","カルディナバン","カローラ","カローラⅡ","カローラアクシオ","カローラセレス","カローラバン","カローラフィールダー","カローラランクス","カローラルミオン","カローラワゴン","ガイア","キャミ","クイックデリバリー","クラウン","クラウン コンフォート","クラウンエステート","クラウンマジェスタ","クラウンワゴン","クラシック","クルーガー","クレスタ","グラシア","グラシアワゴン","グランドハイエース","グランビア","コースター","コルサ","コロナ","サイノス","サクシード","シエンタ","スープラ","スターレット","スパーキー","スパシオ","スプリンター","スプリンターカリブ","スプリンタートレノ","スペイド","セラ","セリカ","セルシオ","センチュリー","ソアラ","ターセル","タウンエース","タウンエーストラック","タウンエースノア","タウンエースバン","タンドラ","ダイナ","ダイナトラック","チェイサー","ツーリングハイエース","デュエット","デリボーイ","トヨエース","トレノ","ナディア","ノア","ハイエース","ハイエースコミューター","ハイエーストラック","ハイエースバン","ハイラックス","ハイラックスサーフ","ハイラックストラック","ハリアー","パッソ","パッソセッテ","ビスタ","ビスタアルデオ","ビスタアルデオワゴン","ピクシスエポック","ピクシススペース","ピクシストラック","ピクシスバン","ピクシスメガ","ファンカーゴ","フォークリフト","ブレイド","ブレイド","ブレビス","プラッツ","プリウス","プリウスα","プレミオ","プログレ","プロナード","プロボックス","ベルタ","ポルテ","マークX","マークXジオ","マークⅡ","マークⅡクオリス","マークⅡバン","マークⅡブリット","マークⅡワゴン","メガクルーザー","ラッシュ","ライトエース","ライトエーストラック","ライトエースノア","ライトエースバン","ライトエースワゴン","ラウム","ラクティス","ランドクルーザー","ランドクルーザーシグナス","ランドクルーザープラド","レクサス","レクサス","レジアス","レジアスエース","レジアスエースバン","レビン"], 15"レクサス":["","CT","GS","HS","IS","IS-F","ISコンバーチブル","LS","RX","SC"] 16}; 17 18function carSet(){ 19 var cars=data[document.selbox.maker.value]; 20 //オプションタグを連続して書き換える 21 var carelement=document.getElementById("car"); 22 while (carelement.firstChild) { 23 carelement.removeChild(carelement.firstChild); 24 } 25 for (var i=1; i<cars.length; i++ ){ 26 var op = document.createElement("option"); 27 op.setAttribute("value",cars[i]); 28 op.innerHTML=cars[i]; 29 carelement.appendChild(op); 30 } 31 //車種名のセレクトボックスの選択番号を0にする 32 document.selbox.car.selectedIndex=0; 33} 34</script> 35</head> 36 37<body> 38 39<form name="selbox"> 40<p>メーカー</p> 41<select id="maker" name="maker" onchange="carSet()"> 42<option value="" data-value="">選択してください</option> 43<option value="トヨタ" data-value="001">トヨタ</option> 44<option value="レクサス" data-value="015">レクサス</option> 45</select> 46 47<p>車種</p> 48<select id="car" name="car"></select> 49</form> 50 51</body> 52</html>

投稿2016/11/27 12:47

Hey_CH

総合スコア437

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

k.nomura

2016/11/27 13:11

ありがとうございます。無事に解決する事が出来ました。m(_ _"m)
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問