1. 程式人生 > >jeasyui 造成$.data(...) is undefined報錯的原因及解決

jeasyui 造成$.data(...) is undefined報錯的原因及解決

一、沒有正常呼叫html渲染方法。

【錯誤程式碼】

var panel = $('<div data-options="tools:\'#tab-tools\'"></div>');panel.addClass('easyui-tabs');panel.addClass('tabs-container');return panel;

【正確程式碼】

var panel = $('<div data-options="tools:\'#tab-tools\'"></div>');panel.tabs(); // html渲染方法return panel;

// 以下程式碼純屬理論猜想未經測試var panel = $('<div data-options="tools:\'#tab-tools\'"></div>');panel.tabs(); // html渲染方法panel.addClass('easyui-tabs');$.parser.parse(panel);return panel;

【註解】
1) 新增class='easyui-tabs'並不能直接引起panel.tabs()方法的執行,只有呼叫$.parser.parse()解析class='easyui-tabs'才會呼叫panel.tabs()。
2) jeasyui的document.ready()方法中已呼叫$.parser.parse()方法,所以一般我們在html中寫class='easyui-tabs'時不需要再呼叫$.parser.parse()方法。(通過ajax動態新增的html需要呼叫$.parser.parse(context)方法才能正常渲染。)

二、使用子類時的bug。

【說明】
如使用propertygrid時會出現“$.data(_44e, "datagrid") is undefined”的報錯,就是因為easyui設定data時使用的是propertygrid,呼叫父類datagrid的方法時獲取data使用的是datagrid。這個似乎是easyui的bug,遇到了只能改原始碼了。

三、程式碼執行順序錯誤。

【說明】
這個問題的根源和第一條其實是一樣的,也是沒有正常呼叫html渲染方法。雖然程式碼上看是正常呼叫了,但是報錯當時渲染方法還沒有執行到。

【解決】
把執行順序弄對了就行。實在不行就用萬惡的setTimeout把會報錯的程式碼的執行順序直接延遲到最後執行。 

setTimeout(function(){// 要延後執行的程式碼},0);

四、頁面更新程式碼重複執行。

【說明】
這個問題的根源和第一條還是一樣的,雖然正常呼叫了一次html渲染方法,但是頁面又被更新到了執行渲染方法前的狀態時,就會報錯了。此時應想辦法解決程式碼重複執行的問題。