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

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

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

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

HTML

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

Q&A

解決済

1回答

6805閲覧

$.getJSONの第2引数の使い方がイマイチ分からないです。

Beginnerrr

総合スコア17

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

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

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

HTML

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

0グッド

0クリップ

投稿2018/08/10 04:14

編集2018/08/10 04:29

私はJavaScriptを始めたばかりで、文法が分かっていなかったり、記法が汚いかもしれませんがご容赦ください!

個人情報入力フォーム的なものを作りながらJavaScriptの勉強をしています。
現在は、学歴の入力フォームを作っています。
仕様は、「中学」「高校」「大学」「行ってない」の4つのラジオボタンと、学校名が入ったセレクトボックスです。
セレクトボックスのデータは、ラジオボタンで学歴をクリックすると学歴ごとにJSONデータを読み込む感じです。

イメージ説明

質問

1、$.getJSONの第2引数の{name,"chara"}の意味がよくわかりません。
サーバーサイドの知識が無いせいだと思うのですが、「サーバーに送信する値を設定」という言葉の意味が理解出来ません。サーバーサイドの知識がなくても分かるような説明が欲しいです。
分かりやすいサイトでも良いので教えてください。

javascript

1function schoolSelect(value) { 2 //セレクトボックスの初期化 3 arrayNum = document.form_signin.school.options.length; 4 for(var i=1; i<arrayNum; i++) { 5 document.form_signin.school.options[1] = null; 6 } 7 8 //選択した学校のリストをjsonファイルからAJAXで取得し、セレクトボックスに追加 9 switch(parseInt(value, 10)) { 10 case 0: //中学 11 $.getJSON("school.json", {name: "chara"}, function(data) { 12 var list = data.juniorhighschool; 13 $.each(list, function(i) { 14 document.form_signin.school.options[i] = new Option(list[i], list[i]); 15 }); 16 }); 17 break; 18 19 case 1: //高校 20 $.getJSON("school.json", {name: "chara"}, function(data) { 21 var list = data.highschool; 22 $.each(list, function(i) { 23 document.form_signin.school.options[i] = new Option(list[i], list[i]); 24 }); 25 }); 26 27 // for(var i=1; i<=list.length; i++ ) { 28 // document.form_signin.school.options[i] = new Option(list[i], list[i]); 29 // }; 30 31 break; 32 33 case 2: //大学 34 $.getJSON("school.json", {name: "chara"}, function(data) { 35 var list = data.university; 36 $.each(list, function(i) { 37 document.form_signin.school.options[i] = new Option(list[i], list[i]); 38 }); 39 }); 40 break; 41 42 default: break; 43 } 44} 45

HTML

1<form class="form-signin" name="form_signin"> 2 <tr> 3 <th>最終学歴<span style="color:red;">*</span></th> 4 <td> 5 <input type="radio" name="career" id="junior" value="0" onchange="schoolSelect(this.value)" ><label for="junior">中学</label> 6 <input type="radio" name="career" id="high-school" value="1" onchange="schoolSelect(this.value)" ><label for="high-school">高校</label> 7 <input type="radio" name="career" id="university" value="2" onchange="schoolSelect(this.value)" ><label for="university">大学</label> 8 <input type="radio" name="career" id="no-career" value="3" onchange="schoolSelect(this.value)" ><label for="no-career">行ってない</label> 9 <br> 10 学校名: 11 <select id="school" class="w250" onblur="careerCheck()" > 12 <option value="0" >-選択-</option> 13 </select> 14 <br> 15 <span id="careerError">*必須項目です</span> 16 </td> 17 </tr> 18</form>

よろしくお願いします!!!

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

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

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

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

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

m.ts10806

2018/08/10 04:18

質問2件は大きく要件が違うように見受けられます。質問を分けられた方が良いです。なぜなら解決済みとするためには「全く違う要件の質問に対して両方同時に解決できるような回答でなければならない」からです。質問は編集できるので片方を別の質問におこされるようすすめます。
Beginnerrr

2018/08/10 04:19

ご指摘有難うございます!訂正します!
guest

回答1

0

ベストアンサー

こういうときはまずはリファレンスにて機能を確認しましょう。

※公式はこちらですが、上記は日本語訳されたものです

第2引数の説明は下記ですね。

サーバに送信する値をマップ値で指定します。 サーバーに送信される前にURLエンコードが施されたURLクエリーの文字列に変換されます。

school.jsonがどのようなデータ形式か分かりませんが、「非同期通信」で行われるこの手の処理では通信で受け取る側(サーバー)内で検索するための条件を必要とするケースが多くあります。
そのための「検索条件」と言うと分かりやすいかもしれません。
例えばGoogle検索をするとき、Amazonなどで商品検索をするとき
何かしら文言やカテゴリを選んで「検索」ボタンを押しますよね。
そのときに入力した情報がサーバー側に送信され、その送信された情報を元に検索処理を行い、結果を返してくれます。
その「サーバー側に送信される入力した情報」が$.getJSON()($.ajax())「第2引数」です。
言葉を置き換えると「json内を検索するための条件を設定」となります。

投稿2018/08/10 04:40

m.ts10806

総合スコア80765

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

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

Beginnerrr

2018/08/10 04:48

とても分かりやくす丁寧なご説明有難うございます! とてもスッキリしました!!!
m.ts10806

2018/08/10 05:05

ご理解いただけたようで良かったです
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問