Question

所以..当在家里的Apache + Php5服务器上进行测试时，一切都在（你们都猜到了）顺利进行。如果它变得更顺畅，我会闻到一些可疑的东西。我做到了。

我将代码上传到freewebhost（嘿......你做你需要的。）来测试是否所有内容都具有相同的功能。

..它......“做了”。因为#mainRight_PubSpot中显示的图像不是应该的那个（它是后面的那个，就像..它应该显示img1显示img2）。此外，如果你注意并仔细阅读它正在加载的图像......不存在。当文件名为fullN.jpg时，它正在加载image / gal / N.jpg。

ps：我想添加一些“$（”＃mainRight_PubSpot“）。css（”background-image“，”url（image / loading.gif）“）;”但它似乎不起作用。

这就是我如何获取文件夹中的图像

var obj = jQuery.parseJSON(data);   
//alert(obj)
    $.each(obj,function(index, value){
        //alert(this);
        var n = index+1;
        //alert(""+n+" "+index);
        var nimg = new Image();
            $(nimg).load(function() {
                $(this).hide();
                $("#mainLeft_imgHold").append("<imgt imgn="+n+"></imgt>")
                $("#mainLeft_imgHold").find('imgt:last').append(this);
                $('imgt').css("background","");
                $(this).fadeIn();
            }).attr({
                src:""+this,
                imgn:""+n,
                id:"imgThumb"
                });

图片名称/ src（又名这个）= image / gal / fullN.jpg（n = 1,2,3，N） * note image / thumbN.jpg与/gal/fullN.jpg（甚至是数字）完全相同的照片

在这样做之后，出于显而易见的原因，我有其中一个“活鼠尾草魔术”

if (event.type == 'mouseover') {
                    $("#mainRight_PubSpot").css("background-image","url(image/loading.gif)");
                     var imgN = $(this).attr("imgn");
                     var img = new Image();
                     $(img).load(function(){
                     $(this).hide();
                     $("#mainRight_PubSpot").append(this);
                     $(this).fadeIn();
                     }
                     ).attr({
                         src:"image/thumb"+imgN+".jpg",
                         width:"249",
                         height:"175",
                         id:"thumBig"
                    });
                }

对于测试porpuses，如果您需要任何其他信息，我会提供该链接。 http://nfd.freehostia.com/folio/findex.html

注意：这在家庭服务器上应该是这样的。它甚至将正确的图像与不存在的链接相关联。（我知道，很奇怪）但是在实时网络服务器中这一切都很混乱

另外：主持人很慢。喜欢.. hella慢。（那个，或者我在点击的东西上有一个错误。它在家庭服务器上没有重现）知道另一个免费的快餐吗？

Answer 1

在Firebug中检查您的DOM，代替拇指，你有大图像，而不是一个大拇指，你有所有拇指，并在onlick处理程序，你添加div到身体没有任何意义，也在鼠标悬停你将拇指添加到#mainRight_PubSpot

onclick应如下所示：

var thumb = $('#mainRight_PubSpot').append('<img class="big"/>').
  find('.big').load(function() {
   $(this).fadeIn();
});

$('imgt').live('click', function(i, item) {
   thumb.fadeOut().attr('src', 'image/thumb/img' + $(item).attr("imgn") + ".jpg");
});

而不是imgt你应该使用div，因为HTML / XHTML中不存在imgt标签。

RE ps：如果你现在添加css背景，它应该显示加载图像，因为加载时会隐藏大图像。

你不使用来自gallery.php的值，如果你想从JSON创建一个库，你应该在gallery.php中返回如下内容：

[[“img / thumb01.jpg”，“img / big01.jpg”] ......]

并在javascript中

$(document).ready(function () {
    $.get('gallery.php',
          function(data){
                 $.each($.parseJSON(data),function(index, value){
                    $('<a href="' + value[1] + '"/>').addClass('thumb').
                        append('<img src="' + value[0] + '"/>').
                        appendTo("#mainLeft_imgHold");
                    /* this could also look like this:
                    $('<a/>').attr('href', value[1]).addClass('thumb').
                        append('<img src="' + value[0] + '"/>').
                        appendTo("#mainLeft_imgHold");
                    */
                });
            });
});

$('.thumb').live('click', function() {
    thumb.attr('src', $(this).attr('href'));
    return false;
});

JQuery - 错误的图像链接加载正确的图像

1 个答案: