javascript - 如何显示以前的用户输入和新输入

标签 javascript html

我是 Html 的新手,我正在尝试创建一个脚本来向用户显示用户输入。每当我输入新的输入时,新的用户输入都会覆盖以前的输入。但我需要显示所有用户输入?如何使用 Javascript 实现。

我的代码

<html><head></head><body>

<input id="title" type="text" >
<input type="submit" value="Save/Show" onclick="clearAndShow()" />

<div id="display2letter"></div>
<div id="display3letter"></div>
<div id="display4letter"></div>

<script type="text/javascript">
var titleInput  = document.getElementById("title");
var display2letter  = document.getElementById("display2letter");
var display3letter  = document.getElementById("display3letter");
var display4letter  = document.getElementById("display4letter");

function clearAndShow () {
    // Split input box value by comma
    titles = titleInput.value.split(",");

    // Reset display divs
    display2letter.innerHTML = "";
    display3letter.innerHTML = "";
    display4letter.innerHTML = "";

    // Cache length so it's not recalculated on each iteration.
    var len = titles.length;
    var twoletter = [];
    var threeletter = [];
    var fourletter =[];
    for (i = 0; i < len; i++) {
        // Check for a-z, A-Z, 
        if (!titles[i].match(/^[a-zA-Z]/)) {
       throw error("Please use only alphabet letters");

        }

        // Dump into storage arrays.
        if(titles[i].length == 2) {
                twoletter.push(titles[i]);
        }
        else if(titles[i].length == 3){
            threeletter.push(titles[i]);
        }
        else if(titles[i].length == 4){ 
                    fourletter.push(titles[i]);
        }
    }

    display2letter.innerHTML += " 2 letters: " + twoletter.join(", ") + "<br/>";
    display3letter.innerHTML += " 3 letters: " + threeletter.join(", ") + "<br/>";
    display4letter.innerHTML += " 4 letters: " + fourletter.join(", ") + "<br/>";
}
</script>
</body>

</html>

最佳答案

尝试声明这些变量 -

 var twoletter = [];
 var threeletter = [];
 var fourletter =[];

clearAndShow()函数之前,即

<script type="text/javascript">
var titleInput  = document.getElementById("title");
var display2letter  = document.getElementById("display2letter");
var display3letter  = document.getElementById("display3letter");
var display4letter  = document.getElementById("display4letter");
var twoletter = [];
var threeletter = [];
var fourletter =[];

function clearAndShow () {

关于javascript - 如何显示以前的用户输入和新输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19512724/

相关文章:

javascript - 从 JS 更改 CSS 不起作用

html - 如何使用 html 5 按钮执行 jsf 操作

javascript - Popover 不显示图像?

Javascript 或 JQuery 写入表中指定列索引的所有行

javascript函数不改变字间距

javascript - 我可以自动换行以防止出现奇怪的第二行问题吗?

javascript - angularjs 过滤器不适用于 i18n 文本

javascript - For 循环在我想要它之前退出

javascript - 数据表 - TableTools ShowSelectedOnly

html - Webpack 样式!css!sass 加载器