selected

オプション配列の選択状態

2009.01.09

構文

　document. Formオブジェクト名.オブジェクト名.options[インデックス].selected [プロパティ]
　document.forms[インデックス].elements[インデックス　].options[インデックス].selected [プロパティ]

インデクス

添番

説明

options配列の選択状態を値に持つ、options配列のプロパティ。
「option」要素を選択している場合は「true」、選択していない場合は「false」の値を持つ。
各値を「selected」プロパティに設定すると、選択項目の選択や選択解除ができる。

用例

ボタンフォームをクリックすると、それに合わせてフォームのoptions配列に「selected」プロパティを使って「true」の値を設定すれば、セレクトフォーム「SForm」の選択されているオプション項目が変わる。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>selected</title>
<script type="text/javascript">
<!--
function C_Change_0() { document.FORM.SForm.options[0].
selected = true }
function C_Change_1() { document.FORM.elements[0].options[1].
selected = true }
function C_Change_2() { document.forms[0].elements[0].options[2].
selected = true }
//-->
</script>
<style type="text/css">
<!--
body { background-color: #ffffff; }
-->
</style>
</head>
<body>
*オプション配列の選択状態
<p>
<form name="FORM">
  <select name="SForm">
    <option>項目1...
    <option>項目2...
    <option>項目3...
   </select>
</form>
</p>
<hr>
<form>
    <input type="button" value=" 項目1を選択する " onClick=
"C_Change_0()">
    <input type="button" value=" 項目2を選択する " onClick=
"C_Change_1()">
    <input type="button" value=" 項目3を選択する " onClick=
"C_Change_2()">
</form>
</body></html>