javascript - 使用输入文本字段使用 Javascript 动态更改函数中的值

Question

我不确定标题是否有意义，但我正在尝试通过文本输入在循环中动态更改变量的值。

到目前为止看一下我的代码

<script type="text/javascript">

function test() {

    var count;
    var str = document.getElementById('inputter').value;
    var plus = str;

    for(count = 0; count < 5; count++, str += plus){

        document.write("<br />");
        document.write(str);

    }
};

</script>

<input type="text" id="inputter" name="inputter"></form>
<button id="sub"  type="button" onclick="test()">Try It Out</button>

因此，如果您使用在文本字段中输入的任何值作为值来点击按钮，例如...您输入“X”，结果将是...

X

XX

XXX

XXXX

XXXXX

但随后表单字段消失了，我必须刷新页面才能再次执行此操作？有没有办法动态地做到这一点？所以在不刷新的情况下，我希望能够输入一个新的字符串，它会改变。

提前致谢!

Answer 1

document.write() 正在覆盖您的页面。不要用它，使用DOM修改函数将字符串放在一个DIV中。

<input type="text" id="inputter" name="inputter"></form>
<button id="sub"  type="button" onclick="test()">Try It Out</button>
<div id="output"></div>

<script>
function test() {

    var count;
    var str = document.getElementById('inputter').value;
    var plus = str;
    var output = '';
    for(count = 0; count < 5; count++, str += plus) {
        output += "<br />" + str;
    }
    document.getElementById('output').innerHTML = output;
};
</script>

DEMO