能否在按钮上使用FancyBox？点击加载内容报错求助

我来帮你排查这个问题～你当前的写法存在逻辑误区，导致FancyBox重复发起请求从而触发加载失败的错误。

问题原因分析 #

你在AJAX请求成功后，调用了$('#btn-dispos').fancybox(...)，这相当于给按钮重新初始化FancyBox插件，而插件会按照你设置的type: 'ajax'再次发起请求去获取内容——但这时候的请求上下文可能已经不符合预期，或者重复请求导致了错误，所以才会出现“请求的内容无法加载，请稍后重试”的提示。

修正后的代码实现 #

正确的做法是：在AJAX成功获取到内容后，直接用FancyBox打开你已经拿到的data，而不是再去绑定按钮的FancyBox事件。

document.getElementById("btn-dispos").addEventListener("click", function(){
    $.ajax({
        type: "get",
        url: path_to_load_plages_dispo_fournisseurs,
        data: {ids : ids},
        success: function(data){
            // 直接打开FancyBox并传入已获取的内容
            $.fancybox.open({
                type: 'html', // 因为已拿到HTML内容，无需再发起AJAX请求
                content: data,
                ...fancyOptions // 展开你的自定义配置项
            });
        },
        // 新增错误处理，方便排查问题
        error: function(xhr, status, error){
            console.error("AJAX请求失败详情:", error);
            $.fancybox.open({
                content: "加载失败，请稍后重试"
            });
        }
    });
});

额外检查点 #

• 先确认path_to_load_plages_dispo_fournisseurs路径正确，AJAX请求本身能成功返回内容（可以在浏览器控制台的Network标签查看请求状态和返回值）。
• 检查fancyOptions里的配置，避免设置了冲突的href或其他影响内容加载的选项。

内容的提问来源于stack exchange，提问作者Noémie Harvey