如何使用jquery获取outerHTML以使其跨浏览器

我在jquery论坛中找到了一个响应，他们做了一个函数来做到这一点，但结果却不一样。 这是我为图像按钮创建的示例：

var buttonField = $(''); buttonField.attr('id', 'butonFshi' + lastsel); buttonField.val('Fshi'); buttonField.attr('src', 'images/square-icon.png'); if (disabled) buttonField.attr("disabled", "disabled"); buttonField.val('Fshi'); if (onblur !== undefined) buttonField.focusout(function () { onblur(); }); buttonField.mouseover(function () { ndryshoImazhin(1, lastsel.toString()); }); buttonField.mouseout(function () { ndryshoImazhin(0, lastsel.toString()); }); buttonField.click(function () { fshiClicked(lastsel.toString()); }); 

我有这种情况：

  buttonField[0].outerHTML = `` 

相反，我找到的外部函数给出了buttonField.outer（）=

function是：

 $.fn.outer = function(val){ if(val){ $(val).insertBefore(this); $(this).remove(); } else{ return $("
").append($(this).clone()).html(); } } 

所以这样我松开了我插入的处理程序。 反正有没有得到带有jquery的outerHTML，以便让它跨浏览器而不会丢失处理程序？！

Answer 1

您不需要首先将其转换为文本（这与处理程序断开连接，只有DOM节点和其他特定JavaScript对象可以有事件）。 只需直接插入新创建/修改的节点，例如

 $('#old-button').after(buttonField).remove();` 

返回之前的jQuery集合after remove现有元素，而不是新元素。

Answer 2

试试这个：

 var html_text = `` buttonField[0].html(html_text); 

🙂

Answer 3

查看来自https://github.com/darlesson/jquery-outerhtml的jQuery插件。 使用这个jQuery插件，您可以从第一个匹配元素获取outerHTML，替换一组元素并在回调函数中操作结果。

请考虑以下HTML：

 My example 

考虑以下电话：

 var span = $("span").outerHTML(); 

变量span等于我的示例。

在上面的链接中，您可以找到有关如何使用.outerHTML（）插件的更多示例。

Answer 4

这应该工作正常：

 var outer = buttonField.parent().html();