掲示板/総合質問板/過去ログ/一覧/ テキストボックスの値をリストボックスへ表示したい

0 名前： sakurabagogo ： 2007/02/02（金） 05:06 ID:.QwN0.Ui sub-9g: 【何をしたいのか】
　はじめまして、sakurabagogoと申します。
　仕事でjavascriptをはじめて触ったのですが、オブジェクト指向に追いついていません。
　C言語なら経験があるのですが・・。
　やりたいことはタイトルの通りなのですが、同ページ内でテキストの値をリストボックスに表示したいです。

【現在の状況】
　もう少し詳細を言うと、まずボタンをクリックするとテキスト内に値が表示されます。
　複数あるテキストに値が表示されたら、さらにボタンをクリックします。
　そうすると、リストボックス内にテキストで表示された値が並ぶようにしたいです。

　ボタンクリックでテキスト内への表示は上手くいきました。

　考え方を教えてくださると嬉しいです。よろしくお願いします。

1 名前：匿名： 2007/02/02（金） 05:06 ID:UYp7ySEN sub-kJ: 現状のコード希望。

2 名前：匿名： 2007/02/02（金） 05:06 ID:UYp7ySEN sub-kJ: 最低限、以下が分からないと回答がつきづらいと思う。

> ボタンをクリックするとテキスト内に値が表示されます。

・「テキスト内」とは、文書内のどの位置にある何要素？

> リストボックス内にテキストで表示された値が並ぶようにしたい

・「リストボックス」とは、文書内のどの位置にある何要素？
・「並ぶ」とはどういうこと？ソートが必要？何をキーにして？

3 名前： sakurabagogo ： 2007/02/02（金） 05:06 ID:.QwN0.Ui sub-9g: 情報が少なすぎて、困らせてしまい申し訳ありませんでした。

イメージとしてはこんな感じでした。

<form name = "F1">
<input type = "text" name = "T1" value = "あいうえお"><br>
<input type = "text" name = "T2" value = "かきくけこ"><br>
<input type = "text" name = "T3" value = "さしすせそ"><br>
<input type = "text" name = "T4" value = "たちつてと"><br>

<input type = "button" name = "B1" value = "リストボックスに表示"><br>

<style size = "4" name = "S1">
<option></option>
<option></option>
<option></option>
<option></option>
</style>

</form>

シンプルにいうとこんな状態なのですが、textの値をリストボックスに表示する場合
textのT1～T4がリストボックス内に上から順番に表示されるようにしたいのです。

4 名前：匿名： 2007/02/02（金） 05:06 ID:iK.3Z8B0 sub-kJ

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>TEST</title>

<form action="#">
<ul>
  <li><input name="T1" value="あいうえお">
  <li><input name="T2" value="かきくけこ">
  <li><input name="T3" value="さしすせそ">
  <li><input name="T4" value="たちつてと">
</ul>

<p>
  <select name="S1"></select>
  <input type="button" name="B1" value="リストボックスに表示" onclick="

var i = 1;
var input, inputList = this.form.elements;
var output = this.form.elements[ 'S1'];

while (input = inputList[ 'T' + i++]) {
    var o = document.createElement( 'option');
    o.value = input.value;
    o.appendChild( document.createTextNode( input.value));
    output.appendChild( o);
}

  ">
</p>
</form>

5 名前： sakurabagogo ： 2007/02/02（金） 05:06 ID:.QwN0.Ui sub-9g: 匿名様、ありがとうございました。

いただいたコードを参考に進めます！
while文で繰り返すわけですね・・・。

6 名前：匿名： 2007/02/02（金） 05:06 ID:iK.3Z8B0 sub-kJ: >>5
個人的に while が好きなだけで、別に for でも構わない（ループ条件が明確なら、むしろ for 文の方が無難）。

この場合、それぞれ

・this はイベントが発生したノード（<input type="button"/>）
・this.form は、それが属している form 要素ノード
・this.form.elements は、その form 要素に含まれるコントロールの集合
・this.form.elements['NAME'] は、その form 要素に含まれるコントロールの集合の中で、name='NAME' を持つもの

を指している。