2013-05-20 96 views
0

我有一个可折叠的设置,并且我已将listview添加到每个可折叠设置。切换图像jquery移动

list view我动态创建像下面

var li = '<li data-icon="false" data-theme="a" ><h5><img src="unselected.png" width="auto" height="3%" >' + row['Date'] + '</h5></li>';  

,我想在点击list item切换image button,我在我的list view只有一个项目在做这样

$('ul').children('li').off('click').on('click', function() { 
    var currentimg = $(this).find('img').attr('src'); 
    if (currentimg == "unselected.png") { 
     $(this).find('img').attr('src', 'selected.png'); 
    } else { 
     $(this).find('img').attr('src', 'unselected.png'); 
    } 
});  

现在应该有selected.png别人应该有unselected.png,我该怎么办?

谢谢:)

回答

2

工作例如:http://jsfiddle.net/Gajotres/3H4g8/

$(document).on('pagebeforeshow', '#index', function(){ 
    $('ul').children('li').off('click').on('click', function() { 
     var clickedItem = $('ul li').index(this); 
     var currentimg = $(this).find('img').attr('src'); 
     if (currentimg == "http://beaglehappy.com/wp-content/uploads/2012/03/beagle-puppy-training-50x50.jpg") { 
      $(this).find('img').attr('src', 'http://profile-a.xx.fbcdn.net/hprofile-snc6/276874_259622770824534_1630725890_q.jpg'); 
     } else { 
      $(this).find('img').attr('src', 'http://beaglehappy.com/wp-content/uploads/2012/03/beagle-puppy-training-50x50.jpg'); 
     } 

     $("li").each(function(index) { 
      var loopLi = $(this);    
      if(clickedItem != index) {    
       loopLi.find('img').attr('src', 'http://profile-a.xx.fbcdn.net/hprofile-snc6/276874_259622770824534_1630725890_q.jpg'); 
      } 
     });   

    });  
});