返回Ajax请求之外的字符串

时间:2010-09-22 16:11:50

标签: javascript jquery ajax

我对此很陌生,所以对我很轻松:

我正在构建一个图像库,其中包含一个主索引页面,允许用户选择不同类别的项目,一个子索引页面,允许用户选择所选类别中的特定项目,然后选择该项目的图库页面。

以下代码适用于主索引页面。我试图将第一个图库页面的第一个图像的src属性的值传递给主索引页面以用作缩略图。

我已经有效地将正确的URL加载到imageLoc变量中,但是我需要将它传递到Ajax请求之外以将其传递到我的HTML文档中。

简单地说,我试图将 imageURL 变量的值传递给 imageLoc 变量。

感谢您的帮助。

    $('.galleryIndex a img').hide().each(function(){
        var destination = $(this).parent('a').attr('href');

        var imageLoc = $.ajax({
            url: destination,
            success: function(data){
                var pageLoc = $(data).find('.galleryList a:first').attr('href');
                $.ajax({
                    url: pageLoc,
                    success: function(data){
                        var imageURL = $(data).find('.galleryBox img:first').attr('src');
                        return imageURL
                    }
                });
            }
        });

        alert(imageLoc);

    });

2 个答案:

答案 0 :(得分:2)

这将导致处理回调函数的方式出现问题。它是一个在请求返回后调用的闭包块,因此它与函数中的主代码分开运行。如果要提醒imageURL变量,请在回调函数内提醒它,或者调用另一个函数来处理它。由于它是异步服务器请求的回调函数,因此警报“imageLoc”的部分将在您获得异步请求之前运行很长时间。

编辑:实现您尝试执行的操作的唯一方法是不异步发出ajax请求。如果设置async:false,则可以调用“responseText”属性,如下所示:

var html = $.ajax({
    url: "some.php",
    async: false
}).responseText;

但要注意......这将在请求待处理时暂停浏览器操作。如果您不希望在加载某些内容时将其与页面混在一起,通常最好通过其他方式阻止用户交互。

答案 1 :(得分:0)

我能够得到我想要的内容如下:

    $('.galleryIndex a img[id!="fp"]').hide().each(function(){
        var destination = $(this).parent('a').attr('href');
        $.ajax({
            url: destination,
            context: $(this),
            success: function(data){
                var pageLoc = $(data).find('.galleryList a:first').attr('href');
                $.ajax({
                    url: pageLoc,
                    context: $(this),
                    success: function(data){
                        var imageURL = $(data).find('.galleryBox img:first').attr('src'); //returns the src for the thumbnails
                        $(this).attr('src', imageURL);
                        $(this).load(function(){
                            $(this).show();
                        });
                    }
                });
            }
        });
    });