0

さて、いくつかの機能があります。それらのほとんどは関連していないと思います。私がしたいのは、ボタンをクリックしたときに html リストを作成し、その値を配列に格納することです。ただし、配列全体を再度出力することなく、このリストを更新できるようにしたいと考えています。入力を受け入れるように設定しました。ループして配列を印刷できますが、配列全体が印刷され、1つだけが必要です。これはよくあることのように思えますが、私の Google-fu は何も返しませんでした。

したがって、入力に接続して配列に記録するリスト変数と、それをクリアして値を出力する別の関数があります。

コードスニペット：

var listItemInput= document.getElementByID("listItem");
var listItem= [];

function insertListItem(){
listItem.push(listItemInput.value);
clearAndShow();
}

function clearAndShow(){
listItemInput.value= "";
}
function printList{
   for (var i = 0; i < listItem.length; i++){
document.getElementById("list").innerHTML += '<li>' + listItem[i] + '</li>';
}

ボタンを押してprintList機能が呼び出されると、配列全体が印刷されますが、最新のアイテムを単に印刷するボタンが必要です。どうすればそれができますか？

明確にするために、リストを html に出力し、値を配列に格納する必要があります。値は後で if else 引数で参照され、新しい変数と結合して出力されます。

編集: var = lastIndex をプラグインして変更し、リスト用にさらに 2 つの変数を作成しました。これでうまくいくようです。ありがとうございました。

4

2 に答える 2

3

印刷された最後のインデックスを追跡できます。

var listItemInput= document.getElementByID("listItem");
var listItem = [];
var lastIndex = 0; //Keep track of the last index shown.

function insertListItem() {
    listItem.push(listItemInput.value);
    clearAndShow();
}

function clearAndShow() {
    listItemInput.value = "";
}

function printList() {
    for (; lastIndex < listItem.length; lastIndex++) {
       document.getElementById("list").innerHTML += '<li>' + listItem[lastIndex] + '</li>';
    }
}

listItemこのアプローチは、配列からアイテムを削除しないことを前提としています。

于 2013-09-13T18:45:08.213 に答える
0

必要な要素が 1 つだけの場合、なぜ反復する必要があるのでしょうか?

function printList() {
    document.getElementById('list').innerHTML = '<li>' + listItem[listItem.length-1] + '</li>';
}
于 2013-09-13T18:45:48.640 に答える