Question

我正在尝试为“使命召唤”中的mod菜单制作一个生成器。我希望人们能够添加菜单或删除菜单。我正在尝试按顺序识别菜单，以便我可以正确使用文本字段值。我这样做，如果他们删除了一个菜单，它会将所有其他菜单的ID更改为一个更低，同样更改为按钮ID，但我不知道如何更改onlick事件以删除正确的元素。

更好的是，如果有更好的方法，我很想知道它。

<script type="text/javascript">
    y = 1
    function test2()
    {
        document.getElementById("test2").innerHTML += "<div id=\"child" + y + "\"><input type=\"text\" value=\"menu name\" \><input id=\"button" + y + "\" type=\"button\" value=\"remove?\" onclick=\"test3(" + y + ")\" /></div>";
        y++;
        alert(y);
    }
    function test3(x)
    {
        document.getElementById("test2").removeChild(document.getElementById("child" + x));

        for(var t = x+1;t < y;t++)
        {
            alert("t is " + t + ". And y is " + y);
            document.getElementById("button" + t).setAttribute("onclick" , "test3(t-1)");
            document.getElementById("button" + t).id = "button" + (t-1);
            document.getElementById("child" + t).id = "child" + (t-1);
        }
        y--;
    }

</script>
<input value="testing" type="button" onclick="test2()" />
<div id="test2" class="cfgcode"></div>

Answer 1

我不担心在添加或删除之后重新索引所有元素，这似乎是浪费。最好简单地编写一个更通用的函数，而不是将元素id硬编码到其中的函数。

例如，您的第一个函数可以这样写：

function genericFunction(el)
{
    var html = ''; // create any new html here
    el.innerHTML = html;
}

然后，您可以添加onclick处理程序，例如：

myDiv.onclick = function() { genericFunction(this) };

我也同意上面的所有评论者，使用jQuery，它使得与DOM交互的任何代码都简单得多。

在Javascript中添加和删除元素？

1 个答案: