Javascript 在将jQuery创建的元素插入DOM树之前，是否可以获取该元素的HTML？

以下是我得到的：

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()
        });
    });
}

gridComplete:function（）{
变量doneButton=$（''{
键入：“按钮”，
值：“完成”，
单击：函数（）{
警报（“完成！”）；
}
});
log（“HTML:，doneButton.HTML（））；
var id=$（this）.jqGrid（'getdataid'）；
var self=这个；
_.每个（id、功能（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
        });
    });
},

gridComplete:function（）{
var doneButtonHtml=“”；
var id=$（this）.jqGrid（'getdataid'）；
var self=这个；
_.每个（id、功能（id）{
$（self）.jqGrid（'setRowData'，id{
MarkDone:doneButtonHtml
});
});
},

---

按预期呈现按钮。

您从按钮中获得一个空字符串，因为

html（）

返回内部html

您可能需要

doneButton.get（0）.outerHTML

更改此选项：

MarkDone: doneButtonHtml.html()

致：

---

doneButtonHtml是一个DOM元素数组。您需要调用get（0）来获取该数组中的第一个元素。

首先要记住的是，.HTML（）实际上检索元素内部的HTML，而不是元素本身的HTML

如果您从对象的jQuery数组访问Javascript元素，那么您应该返回原始html。看看这把小提琴：

var doneButton=$（“”{
键入：“按钮”，
值：“完成”，
单击：函数（）{
警报（“完成！”）；
}
});
//doneButton[0]-您的html

---

尝试传递doneButton[0]，因为它是实际的元素，而不是jQuery包装的元素。

如果我正确理解了您想要的内容，您可以使用另一种方法执行相同的操作。为了减少jqGrid的数量，请构建断开连接的网格体，然后将其插入一个网格体。必须使用

gridview:true

才能获得性能优势。问题只是jqGrid将网格体构建为HTML字符串，而不是DOM。jqGrid提供自定义格式化程序、cellattr和rowattr回调，允许构造自定义列内容或设置行上的一些自定义属性。有关详细信息，请参阅

所以你应该做的是

为列

MarkDone

提供自定义格式设置程序，其中包含

“

（不包含

单击

）事件处理程序的内容

使用

onCellSelect

或

在selectRow

回调之前捕获

单击网格体任何位置的事件，包括单击“完成”按钮。（请参阅）有助于减少网格中所需的事件句柄数
$td=$（e.target）.最近的（“td”）
将为您获取单击的单元格，
iCol=$.jgrid.getCellIndex（$td[0]）
将为您获取列号，
this.p.colModel[iCol].name
将为您获取单击的列的名称

---

，并将为您提供所需的代码示例和其他信息。

这很有效。谢谢我尝试在jQuery元素本身上调用outerHTML，但被告知它没有该方法——因此我走错了方向。哎呀。

MarkDone: doneButtonHtml.get(0)

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

//doneButton[0] - your html