サンデープログラマーである私は、コンピュータメーカーに勤めていても、プログラミングを仕事にしていた時期がほとんどない。
プログラミングは、専ら趣味でしかやってきていないのである。
インターネットなんて影も形もなかったころから、プログラミングをしてはきているのだが、我流に固執するあまり、お馬鹿でお間抜けなコードを量産している。
例えば、Javascriptにおいて、HTMLのselectタグで選択中のoptionのvalueの値を取得したい場合、
<html>
<body>
…
<form name="form_name" id="form_id">
…
<select name="select_name" id="select_id">
…
<option value="ここの値を取得したい">これが選択されているとする</option>
…
</select>
…
</form>
…
</body>
</html>
という構造だったとして、
nameだけで処理するならば、
var v = document.form_name.select_name.options[document.form_name.select_name.selectedIndex].value;
と階層で指定したり、
idならば直接持ってきたり、
var v = document.getElementById('select_id').options[document.getElementById('select_id').selectedIndex].value;
なんてことをやっていて、どうしても冗長なコードを入力せざるを得ない。
同じものを使うんだから、変数に入れて、
var id = document.getElementById('select_id);
var v = id.options[id.selectedIndex].value;
とすればいいじゃないかとも言えなくもない。
さて、ネットを検索すると、
var v = document.frame_name.select_name.value;
や
var v = document.getElementById('select_id').value;
という方法でも行けそうな雰囲気で書かれているところもある。
でも、本当にこれでいいんだろうか？
これは、select_idというidを持つタグのvalueを取得しているに過ぎないと考えてしまう。
もしselectタグにvalueが付いていたら…
そういうポカを犯さないということであれば、後者の方法でも良いのだろうか？
実際に、Firefox、Chrom、Edgeなど主要なブラウザで簡単なテストをしたが、いずれもselectタグのvalueを返すものはなかった。
つまり、optionタグはselectタグのchildなんだけれど、select自体にvalueはなくて、選択されているoptionのvalueが使われるという例外なのだろう。
まぁ、これでプログラムがスッキリとするので、覚えておこう。
↧
Javascriptでselectされたoptionのvalueの値を取得する
↧