我有一个 ListView ,其中的数据是从 JSON 字符串加载的。引用下面的代码。它将显示元素名称和数量。
function loadItemsForList2(){
//load items in page for list 2
//empty existing items from shoppinglist2
$("#shoppingList2").empty();
//regenerate listTwoItems
var lstTwo = localStorage.getItem("listTwo");
if (lstTwo!=null) listTwoItems = JSON.parse(lstTwo);
for (var key in listTwoItems) {
item2 = key; //+ ":" + listTwoItems[key];
item2Qty = listTwoItems[key];
$('#shoppingList2').append('<li class="list"><a class="itemList2"><div><span class="itemInList">' + item2 + '</span><span class="itemInListQty">'+ item2Qty+'</span></div></a><a class="removalLst2"></a></li>');
}
//goto to the page
$.mobile.changePage("#finalShoppingList2");
$("#shoppingList2").listview('refresh');
我希望当用户点击列表中的元素 (li> ) 时,它会更改背景颜色。当再次点击时,它会回到原来的颜色。下面是单击列表项时调用的函数。请注意,只有外线背景被更改为黄色。我需要将整个
我做错了什么。请引用图片List view showing yellow line background 请问我该如何解决这个问题
$("#shoppingList2").delegate(".itemList2", "click", function() {
selectedItem = $(this).text();
//alert(selectedItem);
selectedItem = selectedItem.replace(/\d+/g, '');
alert(selectedItem);
$(this).parent().css("background-color", "yellow");
});
最佳答案
您可以更改列表项中 2 个 anchor 标记的背景色:
$("#shoppingList2").on("click", ".itemList2", function() {
selectedItem = $(this).text();
selectedItem = selectedItem.replace(/\d+/g, '');
$(this).css("background-color", "yellow");
$(this).next("a").css("background-color", "yellow");
});
关于javascript - JQuery 移动更改颜色以单击 ListView ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41138548/