0

フォームを介して配列に要素を追加しようとしています。unshift() メソッドを使用しています。以下のコードは機能しません。その理由を知りたいです。

<form>
<input id="input"> </input>
<input type = "button" id="button"> Click me </input>
</form>


<script>

var input = document.getElementById("input").value;
var button = document.getElementById("button");

var myArray = [];
myArray.unshift(input);



button.onclick = function alerted (){
alert(myArray);
};


</script>
4

3 に答える 3

1

引用されたコードは、ページが読み込まれるとすぐに実行されます。その場合、フォーム フィールドには何も含まれないため、その値は になります''toStringこれを警告すると、アレイに対するデフォルトの操作が実行され''、警告は空白になります。

unshiftすぐにではなく、ボタンのクリックなどのユーザー イベントに応答してコードを実行したい。要素に設定し(その行からinput削除)、割り当てている関数に行を移動し、そこに追加することでそれを行うことができます:.valueunshiftonclick.value

button.onclick = function alerted (){
    myArray.unshift(input.value);
    alert(myArray);
};

その他の注意事項:

  1. あなたは決して書きません</input>input通常、タグはまったく閉じません。XHTML を書いている場合 (おそらくそうではないでしょう)、次のよう/にメインinputタグ内に を配置します<input id="input" />。繰り返しますが、あなたはおそらく XHTML ではなく、HTML を書いているだけです。

  2. inputボタンの値 (キャプション) は、value開始タグと終了タグ内のコンテンツではなく、その属性に入ります。button(要素ではなく、開始タグと終了タグを使用しますinput。)

これらすべてをまとめて、最小限の更新を次に示しますソース

<form>
<input id="input"><!-- No ending tag -->
<input type = "button" id="button" value="Click me"><!-- No ending tag, move value where it should be -->
</form>
<script>

var input = document.getElementById("input"); // No .value here
var button = document.getElementById("button");

var myArray = [];

button.onclick = function alerted (){
    myArray.unshift(input.value); // Moved this line, added the .value
    alert(myArray);
};
</script>
于 2012-10-15T21:05:57.027 に答える
1

デモ

ボタンを送信しない場合は、a) クリックで値を取得し、b) false を返す必要があります。ボタンに変更しました。代替は<input type="button" value="click me" id="button" />

クリック時にフィールドを空にしてフォーカスすることもできます...

<form>
<input id="input" type="text"/>
<button id="button"> Click me </button>
</form>


<script>

var input = document.getElementById("input"); // save the object
var button = document.getElementById("button");

var myArray = [];




button.onclick = function alerted (){
    myArray.unshift(input.value); // get the value
    alert(myArray);
    return false;
};


</script>​
于 2012-10-15T21:07:30.743 に答える
0

onclick 関数で新しい値を取得していません。

これを試してください:http://jsfiddle.net/SeqWN/4/

var button = document.getElementById("button");
var i = document.getElementById("input");
var myArray = [];

button.onclick = function alerted (){
  myArray.unshift(i.value);
  alert(myArray);
};​
于 2012-10-15T21:09:00.307 に答える