jQueryで何番目のセレクトボックスが選択されたか(selectedIndex)

こんちは! basara669です。

レビューばっかりあげてたのに、いきなりJSネタを書きますw
ググったものは自分がハマったものとして書いておこうかなと思います。

今回はセレクトボックスの中の何番目の要素が選択されたかを調べる方法です。

やりたかったこと

下記の様なjsonがあって、

[javascript]
name_0[
{
id:”id”,
date:”date”
},
{
id:”id”,
date:”date”
},
{
id:”id”,
date:”date”
},
],
name_1[
{
id:”id”,
date:”date”
},
{
id:”id”,
date:”date”
},
{
id:”id”,
date:”date”
},
],
name_2[
{
id:”id”,
date:”date”
},
{
id:”id”,
date:”date”
},
{
id:”id”,
date:”date”
},
]

[/javascript]

セレクトボックスから選択をすると、クリックものindexを取り出し、同じ位置の配列を取り出し描画するということをやりたかったわけです。

やり方:selectedIndexを使う

調べたらやり方は簡単にわかりました。下記の用にするとセレクトボックスのindexを取得することが出来ます。

[javascript]

var index = $(e.target).prop(“selectedIndex”);

//別にIDやclassでも良いです。

var index2 = $(“#select”).prop(“selectedIndex”);

[/javascript]

まぁ、知ってればすぐ出来て、知らないとつらいやつですね。

まとめ

あまり使う機会の多いものではないですが、SPAでセレクトボックスを使っているとたまに使っていたりするので、覚えておくためにもブログにしてみました。

Web Developer & Web Designer at Yahoo! Japan. Like HTML, css, JavaScript, Apple, ra-men, Angular, b-monster.

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Scroll to top