Question

我有一个可折叠的设置，我已将listview添加到每个可折叠设置中。

list view我正在动态创建，如下所示

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

我希望在点击image button时切换list item并且我这样做

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

现在我的list view只有一个项目selected.png其他人应该有unselected.png，我该怎么做？

感谢：）

Answer 1

工作示例：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');
            }
        });         

    });      
});

切换图像jquery mobile

1 个答案: