jQuery mobile listview change select item and highlight it
10,812
You can do soemthing as below
$('#listAddr li').bind('click', function () {
$('#listAddr li').attr("data-theme", "c").removeClass("ui-btn-up-b").removeClass('ui-btn-hover-b').addClass("ui-btn-up-c").addClass('ui-btn-hover-c');
$(this).attr("data-theme", "b").removeClass("ui-btn-up-c").removeClass('ui-btn-hover-c').addClass("ui-btn-up-b").addClass('ui-btn-hover-b');
});
Here is an example on Live fiddle
Comments
-
Gank almost 2 years
In a page,there is a listview,the first item is selected:
var len = results.rows.length, $list = $("#listAddr"); var $strHTML =" "; for (var i = 0; i < len; i++) { $strHTML += '<li '; if (i == 0) { $strHTML += ' data-theme="b" '; } $strHTML += '> <a href="#" data-ajax="false"'; $strHTML += ' data-id="' + results.rows.item(i).Id + '">' + results.rows.item(i).Name + '</a></li>'; } $list.html($strHTML); $list.delegate('li a', 'click',function(e){ // $("#listAddr").attr("li").removeClass("liSel"); $(this).addClass("data-theme='b'"); $("#listAddr").listview("refresh"); //$(this).removeClass("data-theme"); clickAddr($(this).data('id')); });
When I select the third item,I want the third item to be "data-theme='b'" style and the first item to remove the theme.How to be able to do that?