option属性の値取得について

解決済

質問者：y3k
質問日時：2007/12/03 20:26
回答数：2件

こんばんは。

オプションタグの値取得の方法について質問があります。

opitonタグのvalue属性の値を取得する際、今までは方法Aのコードを用いていましたが、
最近調べものをしていますと、方法Bのコードで取得するのが正しいと知りました。

方法Aでの値の取得についてはGoogle等で検索しましたが、見当たりませんでしたので、
私の思い込みで記述していたのではないかと思われます。

しかしながら、方法Aであっても方法Bであっても取得する値に差異は見られませんでした。

なぜ方法Aでも動作するのでしょうか？

以上、よろしくお願いいたします。

ＯＳ　　：WinXP SP2
ブラウザ：IE6.0

//------------------------------------------------------------------------
// index.htm
//------------------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
　<head>
　　<meta http-equiv="Content-Script-Type" content="text/javascript" />
　　<script language="javascript" src="./main.js"></script>
　</head>
　<body>
　　<form name="chara">
　　　<select name="job">
　　　　<option value="j01">0</option>
　　　　<option value="j02">1</option>
　　　　<option value="j03">2</option>
　　　　<option value="j04">3</option>
　　　　<option value="j05">4</option>
　　　</select>
　　　<input type="button" value="func()" onclick="func()" />
　　</form>
　</body>
</html>
//------------------------------------------------------------------------
//　main.js
//------------------------------------------------------------------------
function func()
{
　var Job1 = document.chara.job.value;　　　　　　　//　方法A

　var Job2Index = document.chara.job.selectedIndex;
　var Job2 = document.chara.job.options[Job2Index].value;　　　//　方法B

　alert( "Job1: " + Job1 );
　alert( "Job2: " + Job2 );
}

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： yambejp
回答日時：2007/12/04 12:27

>古いブラウザなどを考慮しますと、やはり方法Bが望ましいのでしょうか。

どうなんでしょうね？
私も昔は方法Bを使っていましたが、最近は方法Aにするようにしています。
基本的には古いブラウザっていっても「ものすごく古いブラウザ」なので
たぶん方法Aでいいとおもますよ。
できれば情報提供側としては、いくつかのブラウザでチェックしておくのが
望ましいかと思います。

- 0
- 件

通報する

この回答へのお礼

ご回答ありがとうございます。
現行どおり方法Aでいきたいと思います。
ありがとうございました。

通報する

お礼日時：2007/12/04 20:38

No.1

回答者： yambejp
回答日時：2007/12/03 20:36

古いタイプのjavascriptでは方法Bでしか動作しませんでしたので

「正しい」といえば方法Bなのですが、いまはブラウザが方法Aを
解釈するのが当たり前になってきているので、両方動きます。

方法論から言えば、見たとおり「jobの値を取得する」か
「jobの選ばれた番号とその番号に紐づいたoptionの値を取得する」か
なので、手段が違いますが、得られる値は同じです。

別件ですが、最近はformに名前をつけてはいけないことになっているので
こんな風に、オブジェクト渡しをするか、idをふって管理します。

<script language="javascript">
function func(f){
var Job1 = f.job.value;//方法A
var Job2 = f.job.options[f.job.selectedIndex].value;//方法B
alert( "Job1: " + Job1 );
alert( "Job2: " + Job2 );
}
</script>
<form>
<select name="job">
<option value="j01">0</option>
<option value="j02">1</option>
<option value="j03">2</option>
<option value="j04">3</option>
<option value="j05">4</option>
</select>
<input type="button" value="func()" onclick="func(this.form)" />
</form>

- 0
- 件

通報する

この回答へのお礼

早速のご回答ありがとうございます。
方法Aについてブラウザが解釈してくれるとのことで正直驚いています。
これについて詳細なページがありましたら教えていただけませんでしょうか？
方法Aは記述方法としてスマートな感じがしており、ぜひ使いたいのですが、
古いブラウザなどを考慮しますと、やはり方法Bが望ましいのでしょうか。

通報する

お礼日時：2007/12/03 23:17

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！