0
$(function () {
    loadFiles('Reports');
    var colorboxOptions = GetColorboxOptions();
    colorboxOptions.onOpen = onViewFileClicked;
    $("a.link_file").colorbox(colorboxOptions);

});

我需要用 ajax 调用填充一个空的 div loadFiles('Reports')。但是如何添加colorbox到新创建的<a>标签中呢?上面的代码永远不会起作用。似乎colorbox无法找到a.link_file在 之后创建的所有标签$(document).ready()。有人可以帮我吗?谢谢你。

- -更新 - -

loadFiles正在使用 jTemplate

function loadFiles(folder) {
$.ajax({
    url: '/Api/Files/' + folder,
    type: "GET",
    contentType: "application/json; charset=utf-8",
    success: function (result) {
        console.log(result);
        $('#Container').setTemplateURL("/Templates/FileList.htm", null, { filter_data: false });
        $('#Container').processTemplate(result);
    }
});

}

它的作用是生成 Html 代码来填写<div>被调用的Container.

4

2 回答 2

2

如果您的 loadFiles 函数正在调度 ajax 调用,那么可能发生的是它正在生成一个新线程来处理抓取数据并继续执行其余的函数。当您希望在 ajax 调用完成后发生某些事情时,您需要将您想要发生的事情放在 ajax 调用中的“success:”函数中。否则,你无法保证事情会按照你想要的顺序发生。

如果您可以编辑 loadFiles 函数,只需输入

var colorboxOptions = GetColorboxOptions();
colorboxOptions.onOpen = onViewFileClicked;
$("a.link_file").colorbox(colorboxOptions);

在ajax调用的成功函数中。

或者,您可以添加

async: false,

到您的 Ajax 调用。我个人不推荐这条路线,因为它可能会导致其他错误,但如果您将此功能用于多种用途,这可能是您的最佳选择。

于 2012-05-31T16:23:11.620 回答
1
$(function () {
    loadFiles('Reports');
});

function loadFiles(folder) {
$.ajax({
    url: '/Api/Files/' + folder,
    type: "GET",
    contentType: "application/json; charset=utf-8",
    success: function (result) {
        console.log(result);
        $('#Container').setTemplateURL("/Templates/FileList.htm", null, { filter_data: false });
        $('#Container').processTemplate(result);

        var colorboxOptions = GetColorboxOptions();
        colorboxOptions.onOpen = onViewFileClicked;
        $("a.link_file").colorbox(colorboxOptions);
    }
});

我不保证,但我猜测您的 colorBox 代码需要在 ajax 调用返回后运行,请尝试将其置于上述成功回调中。

于 2012-05-31T16:58:52.303 回答