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

下面是我得到了什么：是否可以在插入DOM树之前获取jQuery创建元素的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() 
     }); 
    }); 
}

如果我只是尝试，并插入doneButton对象时，jqGrid的细胞呈现，而不是实际的按钮[对象的对象。因此，我可以推断它期望原始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 
     }); 
    }); 
},

它按预期呈现按钮。

来源

2013-03-27 Sean Anderson

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

你可能想doneButton.get(0).outerHTML

来源

2013-03-27 17:22:05

这工作。谢谢！我试着在jQuery元素本身上调用outerHTML，并被告知它没有方法 - 所以我在错误的轨道上跳下了。哎呀。 – 2013-03-27 17:28:26

更改此：

MarkDone: doneButtonHtml.html()

要：

MarkDone: doneButtonHtml.get(0)

doneButtonHtml是一个DOM元素数组。您需要拨打获取（0）以获取该数组中的第一个元素。

来源

2013-03-27 17:26:41

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

如果您从jQuery数组对象访问Javascript元素，则应该返回原始HTML。看看这个小提琴：http://jsfiddle.net/NvKYT/

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

//doneButton[0] - your html

尝试通过doneButton [0]，因为这是实际的元素，而不是jQuery的包装元素。

来源

2013-03-27 17:29:10 Jeremy

如果我正确理解你想要什么，你可以用另一种方法做同样的事情。要减少jqGrid构建网格体的web browser reflows数量断开连接，然后将其插入到一个。必须使用gridview: true才能获得性能优势。问题只在于，jqGrid将网格体构建为HTML字符串，而不是DOM。 jqGrid提供自定义格式化器，cellattr和rowattr回调函数，允许构建自定义列内容或设置行上的一些自定义属性。有关详细信息，请参阅the answer。

所以，你应该做的是

提供自定义格式为MarkDone列与内容"<input type='button' value='Done' />"（不click）事件处理
使用onCellSelect或beforeSelectRow回调赶上任何地方click事件格子体包含点击“完成”按钮。 The event bubbling（请参阅here）有助于减少网格中所需的事件句柄数量。$td = $(e.target).closest("td")会为您提供被点击的单元格，iCol = $.jgrid.getCellIndex($td[0])会为您指定列号，this.p.colModel[iCol].name会为您提供点击列的名称。

The answer，another one和the oldest one会得到你需要你的代码示例和其他信息。

来源

2013-03-27 17:43:41 Oleg

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

回答

相关问题