關(guān)于 jQuery Easyui異步加載tree的問題解析
想要實現(xiàn)從本地中加載json文件,通過事件來動態(tài)的插入到ul中時,遇到了一小bug
html中代碼是這樣的
<ul class="easyui-tree" id="tt"></ul>
js中的代碼
$(".next-menu:nth-child(1) a").click(function() { var $IDstr = $(this).attr("id"), $treeIDNum = parseInt($(this).attr("treeID")), jsonURL = "json/" + $IDstr + ".json", node; addAttr2Tree(jsonURL); changeImgSrc($treeIDNum); }); }); function changeImgSrc(nodeID){ var node = $("#tt").tree('find', nodeID); if(node){ $("#tt").tree('select', node.target); } if (node.attributes) { $("#img-box").attr("src", node.attributes.url); } } function addAttr2Tree(URL){ $("#tt").tree({ url: URL, method: "get", animate: true, lines: true }); }
起初是想通過一個按鈕的點擊事件來動態(tài)的加載tree的內(nèi)容就是如上代碼,addAttr2Tree 是用來將點擊按鈕時對應的本地json數(shù)據(jù)加到html中的ul標簽中, changeImgSrc 是對tree節(jié)點的一些選中操作以及圖片的加載,但是無論怎么調(diào)試,總是會出現(xiàn)一條錯誤
無法獲取attributes屬性!??!我反復確認attributes是完整無缺的放在json文件里的而且總是第一次點擊按鈕時才會出現(xiàn)這種錯誤,第二次及其以后,這種錯誤是沒有的
后來我就想到,是不是因為json數(shù)據(jù)動態(tài)加載的速度比不上程序代碼執(zhí)行的速度?!
果然不出我所料!easyui中tree自帶了一個方法onLoadSuccess 當數(shù)據(jù)成功加載時,才會執(zhí)行一些操作
所以
$(".next-menu:nth-child(1) a").click(function() { var $IDstr = $(this).attr("id"), $treeIDNum = parseInt($(this).attr("treeID")), jsonURL = "json/" + $IDstr + ".json", node; addAttr2Tree(jsonURL); $("#tt").tree({ onLoadSuccess: function(){ changeImgSrc($treeIDNum); } }); });
代碼改成這樣就可以了。
以上所述是小編給大家介紹的jQuery Easyui異步加載tree的問題解析,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
javascript截圖 jQuery插件imgAreaSelect使用詳解
這篇文章主要介紹了avascript截圖 jQuery插件imgAreaSelect使用詳解,需要的朋友可以參考下2016-05-05Jquery之Bind方法參數(shù)傳遞與接收的三種方法
這篇文章主要介紹了Jquery的Bind方法參數(shù)傳遞與接收的三種方法,需要的朋友可以參考下2014-06-06jQuery的ajax中使用FormData實現(xiàn)頁面無刷新上傳功能
這篇主要寫如何利用ajax和FormData實現(xiàn)頁面無刷新的文件上傳效果,主要用到了jQuery的ajax()方法和XMLHttpRequest Level 2的FormData接口。需要的的朋友參考下本文2017-01-01jQuery在線選座位插件seat-charts特效代碼分享
這篇文章主要介紹了jQuery在線選座位插件seat-charts特效,推薦給大家,有需要的小伙伴可以參考下。2015-08-08jquery實現(xiàn)的判斷倒計時是否結(jié)束代碼
在一些購物網(wǎng)站經(jīng)常會遇到倒計時的功能,例如某些商品在一定期限內(nèi)搞活動,下面小編給大家分享一段代碼關(guān)于jquery實現(xiàn)的判斷倒計時是否結(jié)束代碼,希望對大家有所幫助2016-02-02