form=jQuery("<form>"
,{
"method":"post"
,
"action":node.get("inline-edit-target")
}
);
$(node).after(form);
//console.log($(node).html());
fieldNode=$(node).find(".inline-edit-field");
console.log(fieldNode.length);
fieldNode.each(function(index,elem)
{
console.log($(elem).data("field-name"));
$(form).append("<span>").html($(elem).data("field-name"));
$(form).append("<input>"
,{
"type":"text"
,
"name":$(elem).data("field-name")
,
"value":$(elem).text()
});
}
);
它基本上是检查 DOM 并准备一个表单。表单正确解析两个字段(fieldNode.length 产生正确的数字)。它还会正确打印节点,直到我添加了 span
标记。为什么它不起作用?
最佳答案
问题,如果它是唯一的问题,是这一行:
$(form).append("<span>").html($(elem).data("field-name"));
并且源于 append()
返回附加了新元素的原始元素,不是新元素本身 (proof of concept)。
因此,您要附加一个 span
,然后立即将父 div 的 HTML 覆盖到任何 $(elem).data('field-name')
返回。
另外,紧接着的行会有问题,因为 jQuery 不会(或不能)使用对象创建元素,并追加(proof of failure) ,相反,您必须使用一串 html,例如,在您的情况下:
$(form).append('<input type="text" name="' + $(elem).data('field-name') + '" value="' + $(elem).text() + '" />');
或者(这可能更容易):
$(form).append($("<input />" ,{
"type" : "text",
"name" : $(elem).data("field-name"),
"value" : $(elem).text()
}));
关于javascript - 附加跨度不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17757817/