javascript - 是否可以在将 jQuery 创建的元素插入 DOM 树之前获取其 HTML？

Question

这是我得到的:

gridComplete: function() {
    var doneButton = $('<input>', {
        type: 'button',
        value: 'Done',
        click: function() {
            alert("Done!");
        }
    });

    console.log("HTML:", doneButton.html());

    var ids = $(this).jqGrid('getDataIDs');
    var self = this;
    _.each(ids, function(id) {
        $(self).jqGrid('setRowData', id, {
            MarkDone: doneButton.html()
        });
    });
}

如果我只是尝试插入 doneButton 对象，jqGrid 单元将呈现 [object Object] 而不是实际的按钮。因此，我可以推断它需要原始 HTML。但是，doneButton.html() 返回一个空字符串...大概是因为我还没有将 doneButton 对象附加到文档上。

使用 jQuery 有什么技巧吗？我更喜欢使用更简洁/更安全的语法来生成 HTML 标记，但我可以这样做:

gridComplete: function() {
    var doneButtonHtml = "<input type='button' value='Done' onclick=\"alert('Done');\" />";

    var ids = $(this).jqGrid('getDataIDs');
    var self = this;
    _.each(ids, function(id) {
        $(self).jqGrid('setRowData', id, {
            MarkDone: doneButtonHtml
        });
    });
},

按预期呈现按钮。

Answer 1

您从按钮中得到一个空字符串，因为 html() 返回内部 HTML。

您可能需要 doneButton.get(0).outerHTML