26

HTMLページにselect要素があります。配列を入力したいと思います。アクションスクリプトでcomboBoxにデータプロバイダーとして配列を指定できるためです。私は次のことをします

HTMLで...

<table>
  <tr>
    <td>
      <label>Recording Mode:</label>
    </td>
    <td>
      <select id="rec_mode">        
      </select>
    </td>
  </tr>
</table>

javascriptで..。

var videoSrcArr = new Array("option1", "option2", "option3", "option4", "option5");

ページにVideoSrcArrがロードされているときに、rec_mode要素にデータを入力するにはどうすればよいですか？ありがとう

4

6 に答える 6

28

次のような形式を使用することを強くお勧めします。

var options =
[
  {
    "text"  : "Option 1",
    "value" : "Value 1"
  },
  {
    "text"     : "Option 2",
    "value"    : "Value 2",
    "selected" : true
  },
  {
    "text"  : "Option 3",
    "value" : "Value 3"
  }
];

var selectBox = document.getElementById('rec_mode');

for(var i = 0, l = options.length; i < l; i++){
  var option = options[i];
  selectBox.options.add( new Option(option.text, option.value, option.selected) );
}

デフォルトのオプションを選択しなければならないという問題に遭遇することはなく、オプション配列を動的に簡単に生成できます。

- アップデート -

上記のコードの ES6 バージョン:

let optionList = document.getElementById('rec_mode').options;
let options = [
  {
    text: 'Option 1',
    value: 'Value 1'
  },
  {
    text: 'Option 2',
    value: 'Value 2',
    selected: true
  },
  {
    text: 'Option 3',
    value: 'Value 3'
  }
];

options.forEach(option =>
  optionList.add(
    new Option(option.text, option.value, option.selected)
  )
);
于 2013-01-23T06:19:54.160 に答える
7

配列の代わりにオブジェクトを使用することをお勧めします。これは非常に役立ち、標準に準拠しています。その理由は、「キー」によってオブジェクトにインデックスを付け、「値」を取得できるからです。コンテンツを表示してリセットするには、このメモに従うことができます

ここをチェック

<!DOCTYPE html>
<html>
<body>
<table>
  <tr>
    <td>
      <label>Recording Mode:</label>
    </td>
    <td>
      <select id="rec_mode">        
      </select>
    </td>
  </tr>
</table>
</body>
<script>
var myobject = {
    ValueA : 'Text A',
    ValueB : 'Text B',
    ValueC : 'Text C'
};
var select = document.getElementById("rec_mode");
for(index in myobject) {
    select.options[select.options.length] = new Option(myobject[index], index);
}

</script>
</html>
于 2013-01-23T05:54:44.367 に答える
5

これは、comboBox に配列を設定する最も簡単な方法です。

var j = new Array("option1","option2","option3","option4","option5"),    
var options = '';

for (var i = 0; i < j.length; i++) {
   options += '<option value="' + j[i]+ '">' + j[i] + '</option>';
}
$("#rec_mode").html(options);
于 2013-01-23T06:14:45.077 に答える
2

あなたはこれを行うことができます：

var videoSrcArr = new Array("option1","option2","option3","option4","option5"),
    selectEl = document.getElementById('rec_mode');


for(var i = 0; i < videoSrcArr.length; i++){
    selectEl.options.add(new Option(videoSrcArr[i], videoSrcArr[i]));
}
于 2013-01-23T05:55:08.437 に答える