使用JQuery动态添加Div

Question

我不确定这是否是最佳选择...但我想要的选项是，当用户点击一个按钮时，它会添加另一个 <div> 或 <li>。

我将允许用户上传多个文档。我希望用户能够单击一个按钮，生成一个带有预定义代码的新 <div> 或 <li>。这可行吗？

这是一个示例..

http://jsfiddle.net/AHvwP/1/

- JD Audi

---

是的，使用JavaScript可以创建新的DOM元素。你尝试过什么吗？有很多jQuery教程可供参考。 - Felix Kling

Answer 1

试试这个：

$('.button').click(function() {
    $('#myContainer').append('<div>the new guy</div>');
});

- theabraham

Answer 2

在 jsFiddle 上更新了您的示例

$("input[type=submit]").click(function(){
    $("<li />").html("item").appendTo("ul");
})

你可以使用$("<tag />")创建元素，并设置属性，添加类等。然后将其附加到您想要的位置。

- BrunoLM

---

有没有办法使它动画化？ - JD Audi

Answer 3

您可以像这样向现有的父元素添加新元素： 选择要添加新的

/

的元素，使用.append()函数。

$("#id").append("<div>foo</div>");

http://api.jquery.com/append/

或者，您可以使用.html()

http://api.jquery.com/html/

- Matt Ryan

Answer 4

如果您需要允许多个文件上传，您是否考虑使用像http://www.uploadify.com/这样的jQuery插件？它可以从一个对话框窗口中进行多个文件上传，您就不必担心这个问题了。

- Jeremy Battle

Answer 5

$("input[type=submit]").click(function(){
    $("<li />").html("item").appendTo("ul");
})

您可以使用$("<tag />")创建元素，并设置属性、添加类等。然后将其附加到您想要的位置。

- dhana govindarajan