在嵌套的get()jQuery

时间:2015-07-09 11:15:11

标签: javascript jquery html dom asynchronous

我目前正在使用jQuery get方法读取另一个页面中的表格,该表格中包含要下载文件的列表,并链接到其他类似的网页。

$.get(filename_page2, function(response, status){
    var data = $("<div>" + response + "</div>");
    var target_element = data.find(target_element_type_page2 + '#' + target_element_id_page2)[0];
    var container = document.getElementById(element_change_content_page1);
    if (typeof target_element !== "undefined"){
        var rows = target_element.rows;
        for (var i = 1, n = rows.length; i < n; i++) {
            var table = rows[i].cells[1].getElementsByTagName("TABLE")[0];
            var isFolder = table.getAttribute("CType") == "Folder";
            var elem = table.rows[0].cells[0];
            var text = elem.innerText || elem.textContent;
            var link = elem.getElementsByTagName("A")[0].getAttribute("href");
            if (!isFolder) {
                container.innerHTML += "<li class=\"mainfolderfile\">" + "<a class=\"filelink\" href=\"" + link + "\">" + text + "</a></li>";
            } else {
                container.innerHTML += "<li class=\"folderlist\">" + "<a class=\"folderlink\" onclick=\"open_submenu(this)\" href=\"#\">" + text + "</a><ul></ul></li>";
                var elem_page1 = container.getElementsByTagName("li");
                var container_page1 = elem_page1[elem_page1.length - 1].getElementsByTagName("ul")[0];
                create_subfolder(container_page1, link);
            }
        }
    } else {
        container.innerHTML += "<li class=\"mainfolderfile\">" + "<a class=\"filelink\" href=\"" + "#" + "\">" + "Error..." + "</a></li>";
    }
}, page2_datatype);

这很好用,并列出了所有文件夹和文件。但是当我尝试对文件夹(调用create_subfolder函数)做同样的事情并使用子文件夹和文件创建子列表时,我得到了一个奇怪的行为。

function create_subfolder(container2, link1) {
    $.get(link1, function(response, status){
        var data = $("<div>" + response + "</div>");
        var target_element = data.find("table" + "#" + "onetidDoclibViewTbl0")[0];
        if (typeof target_element !== "undefined"){
            var rows = target_element.rows;
            for (var i = 1, n = rows.length; i < n; i++) {
                var table = rows[i].cells[1].getElementsByTagName("TABLE")[0];
                var elem = table.rows[0].cells[0];
                var text = elem.innerText || elem.textContent;
                var link2 = elem.getElementsByTagName("A")[0].getAttribute("href");
                //nothing is changed in the webpage. The modifications in the html don't appear
                container2.innerHTML += "<li><a href=\"" + link2 + "\">" + text + "</a></li>";  
            }
        }
        alert(container2.innerHTML); // Print the html with all the modifications
    }, "html");
}

create_subfolder()函数中的第二个get()不会更改网页中的任何内容,因此不会创建任何子列表。但是,当我在get()函数结束时调用alert()函数时,它会打印代码,其中包含应该在第二次获取回调时在html中进行的所有修改。我认为这个问题与get函数的异步行为有关,但我不确切知道原因。有什么猜测吗?

0 个答案:

没有答案