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函數後失去引用

回答

相關問題