javascript - Firefox 中的 Jquery append 表单

Question

在 jquery 中使用此代码时:

$('#slider').prepend('<form action="/file-upload" class="dropzone" id="dropzone">');

Firefox 会自动插入表单关闭标记:(下面的代码是生成的 HTML)

<form action="/file-upload" class="dropzone" id="dropzone">
</form>

我想通过 jquery 决定在哪里放置表单关闭标记。Firefox 只是忽略我的代码并插入表单关闭标记，如上所示。

Answer 1

从 JavaScript 插入 DOM 节点与在源文件中编写 HTML 行不同。无论使用哪种语法，都会插入整个节点(在您的情况下是 <form/> 节点)，不存在半节点之类的东西。要么全有，要么全无。

$("#slider").prepend("<form>");
//should be written as
$("#slider").prepend("<form/>");
//and, in all browsers, is equivelent to
$("#slider").prepend("<form></form>");

如果您希望插入的节点包含一些内容，则:

$("#slider").prepend("<form ...> <!-- all the form's contents here --> </form>")

或

var $form = $("#slider").prepend("<form ... />");
$form.append(...);
$form.append(...);
$form.append(...);

或

var $form = $("#slider").prepend("<form ... />");
$form.html(...);

或者这些的混合体。