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

问题是： 我有一个通过.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>

正如您可以从这一行中看到的，

$（this）.toggleClass（'selected'）；

单击时，它正在切换一个类。 到目前为止一切都很好，我的问题发生在我保存表单并通过ajax刷新表单时。具有选定类的图像现在不再具有选定类，因为它们已被刷新。 我确实在页面上有带有所选图像当前src的输入字段。如果输入字段中的src与通过.load（）调用重新加载的图像的src匹配，是否有方法搜索这些字段并重新应用该类？

---

Chris

您需要将当前选定的项目存储在一个变量中，并且在加载图像后，您需要重新分配类

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');
        }
    });
});

live

is，请改用

on

。

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');
        }
    });
});