0

我正在尝试使用重复多次的特定字符填充 div，这是一个非常基本的任务，或者我认为，为此我编写了以下 JS 方法：

<script>
            function populateTarget()
                {
                    var target = document.getElementById("div_target");
                    var nrSteps = parseInt(document.getElementById("nr").value);

                    for (var i=0;i<nrSteps;i++)
                        {
                            target.innerHTML+=("x");
                        }
                }
</script>

问题是“x”的出现，但只出现了几分之一秒，我只有在打开萤火虫时才能注意到。

该功能由以下形式的按钮触发：

             <form>
                    Nr de caractere: <input type="text" value="1" id="nr"/>
                    <br/>
                    Caracterul dorit:
                    <select id="chr">
                      <option value="c">c</option>
                      <option value="b">b</option>
                      <option value="g">g</option>
                      <option value="o">o</option>
                    </select>
                    <br/>
                    <button onclick="populateTarget()"> Genereaza</button>
                </form>

这是div：

 <style >
    body
    {
        color: white;
        background-color: blue;
    }

    #div_target,#div_form
    {
        height: 300px;
        width: 300px;
        border:5px solid white;
    }

    #div_target
    {
        float: left;
        overflow: scroll;
    }
</style>

 <div id="div_target">
 </div>

在此之后没有其他函数与 div 的内部 html 混淆，虽然我知道直接添加到 innerHTML 是一种非常不雅的方法，但我只是想检查我是否可以在编写更高级的内容之前添加字符。

我的代码的代码笔。

有没有人知道我做错了什么，也许是一个最好的解决方案，我只使用纯 JS，没有库？

4

1 回答 1

1

当您触发运行您的populateTarget函数的事件时，您是否可能重新加载页面？例如，它是否在具有诸如“.”之类的动作的表单中，由按钮触发？

这可以解释你所看到的行为。

如果函数以 结尾return false;，如果我的猜测是正确的，它可能会阻止这种情况。

于 2013-02-22T19:38:30.553 回答