DOM对象在通过jquery函数后失去引用

奇怪的事情发生在我身上并带有对象引用。DOM对象在通过jquery函数后失去引用

我有一个穿通在onclick

var tdButtonDOMCopy = $('#tD'+catSeq+'Button');

以下DOM而这是在-Jquery的创建的按钮，参照它的下一个功能：

tdButtonDOM.replaceWith('<button id="buttonChange" onclick="approveFormEdit(\''+tdButtonDOMCopy+'\')"\n\ 
          class="btn btn-primary">Sla wijziging op</button>');

我想要将此整个DOM元素[Object object]作为参数传递给其下一个功能：

function approveFormEdit(tdButtonElement) { 
    alert(tdButtonElement.html()); 
    .... - Omitted -

现在这里是有趣的事：

在onclick节的目标tdButtonDOMCopy被看作是一个DOM对象，我可以使用.html()方法就可以了。

但是，一旦对象达到函数approveFormEdit，.html()方法不再有效，因为它以某种方式丢失了引用DOM对象。

这到底是怎么回事？

这与上下文

jsfiddle.net/1vdwv5r8

来源

2017-03-06 MwBakker

请不要混用过时的DOM0内联事件处理程序和jQuery。 – Alnitak

通过将对象与其他文本文字连接起来，可以将对象放入字符串上下文中。所以它的toString方法被调用 - 对于没有定义它们自己的对象，调用一个通用版本，并且只返回文本'[object Object]'。你不能以这种方式传递复杂的对象。倾听@Alnitak所说的 - 并使用_proper_ jQuery方法。如果您需要对某个对象的引用，则将其存储在稍后需要使用f.e引用它的元素上。 https://api.jquery.com/data/ – CBroe

感谢您提出这些建议。传递DOM对我来说是新的，因为之前我在.replace（）函数中重写了整个DOM html，所以我宁愿只复制元素而不是重写它。 – MwBakker

你通过它在引号因此拨弄它的一个字符串字面所以错误预期为的.html（）是一个jQuery方法。

您需要删除通过tdButtonDOMCopy不带引号，那么它将被作为变量处理

tdButtonDOM.replaceWith('<button id="buttonChange" onclick="approveFormEdit(tdButtonDOMCopy)" class="btn btn-primary">Sla wijziging op</button>');

不过，我会建议你通过选择使用哪一个可以在retrived data-*自定义属性事件处理程序;

var tdButtonDOMCopy = '#tD' + catSeq + 'Button'; 
tdButtonDOM.replaceWith('<button id="buttonChange" data-target="' + tdButtonDOMCopy + '" class="btn btn-primary">Sla wijziging op</button>'); 

function approveFormEdit() { 
    var targetSelector = $(this).data('target'); ; 
    tdButtonElement = $(targetSelector); 
} 

$(document).on('click', '#buttonChange', approveFormEdit)

来源

2017-03-06 11:35:51 Satpal

不幸的是，“Uncaught SyntaxError：意外的标识符”是我在编辑时得到的 – MwBakker

@MwBakker，使用更新的代码snipper – Satpal

我将使用数据属性。到目前为止，当我让对象使用.html（）方法时，我仍然会得到'未定义'，但我会尝试去解决这个问题。 jQuery中的数据属性用法对我来说是新的。 – MwBakker

DOM对象在通过jquery函数后失去引用

回答

相关问题