Question

这是一个问题：我有一个通过.load加载的图像列表（在我的页面上的div上

）

$('.widget-top').live("click", function() {
    $(".area").load("/galleries/ #projects > li a");
});

他们加载了这个结构：

<a href="#"><img src="photoA.jpg" /> </a>
<a href="#"><img src="photoB.jpg" /> </a>
<a href="#"><img src="photoC.jpg" /> </a>
<a href="#"><img src="photoD.jpg" /> </a>
<a href="#"><img src="photoE.jpg" /> </a>

我单击图像并重新获得src并添加到表单值中，如下所示：

$("#widgets-right .area a").live("click", function() {
    $(this).toggleClass('selected');
    if ( i === 2){
        alert('added to project 1 if you want to add more projects just click the button below');
        var title = $(this).attr('title');
        $(".title").val(title);
        var link = $(this).attr('href');
        $(".link").val(link);
        var img = $("img", this).attr('src');
        $(".img").val(img);
        var imgexample = $("img", this).attr('src');
        $(".gallery_one").attr("src", imgexample);
    }
    else{
        i --;
        alert('added to project'+i); 
        var title = $(this).attr('title');
        $('.title'+i).val(title);
        var link = $(this).attr('href');
        $('.link'+i).val(link);
        var img = $('img', this).attr('src');
        $('.img'+i).val(img);
        var imgexample = $('img', this).attr('src');
        $('.gallery_one'+i).attr("src", imgexample);
        i++;
    }
});

正如您在此行$(this).toggleClass('selected');中所看到的，它在点击时切换了一个类。到这里一切都很好，我的问题发生在我保存我的表格，它通过ajax刷新。具有所选类的图像现在不再具有所选类，因为它们已被刷新。我的输入字段包含页面上所选图像的当前src。如果输入字段中的src与通过.load（）调用重新加载的图像的src相匹配，有没有办法搜索这些字段并重新应用该类？克里斯

Answer 1

您需要将当前所选项目存储在变量中，并且在加载图像后需要将该类别分配回来

var selected; // it should be in a context shared between both the methods

$("#widgets-right .area a").live("click", function() {
    $(this).toggleClass('selected');
    if ( i === 2){
        alert('added to project 1 if you want to add more projects just click the button below');
        var title = $(this).attr('title');
        $(".title").val(title);
        var link = $(this).attr('href');
        $(".link").val(link);
        var img = $("img", this).attr('src');
        $(".img").val(img);
        selected = img;
        var imgexample = $("img", this).attr('src');
        $(".gallery_one").attr("src", imgexample);

    }   
    else{  
        i --;
        alert('added to project'+i); 
        var title = $(this).attr('title');
        $('.title'+i).val(title);
        var link = $(this).attr('href');
        $('.link'+i).val(link);
        var img = $('img', this).attr('src');
        $('.img'+i).val(img);
        selected = img;
        var imgexample = $('img', this).attr('src');
        $('.gallery_one'+i).attr("src", imgexample);
        i ++;
    }    
});

$('.widget-top').live("click", function() {
    $(".area").load("/galleries/ #projects > li a", function(){
        if(selected){
        $(".area").find('img[src="' + selected + '"]').closest('a').toggleClass('selected');
        }
    });
});

如果img src当前存在于页面上，则将类应用于一个ajax加载的img？

1 个答案: