包含文本和 URL 的图像列表视图

Image List view with text and URL

本文关键字:图像 列表 视图 URL 文本 包含      更新时间:2023-09-26

我想用图标和文本显示和列出。列表是指向特定 URL 的链接。我将所有这些存储在一个数组中,但图像没有从数组中填充。这是一个尖刺。

var mainPanel = [ {
    icon : "images/green/home.png",
    title : "Home",
    url : "#tilehome-page"
}, {
    icon : "images/green/home.png",
    title : "Mayor's Conner)",
    url : "#mayorsmessage-page"
}, {
    icon : "images/green/home.png",
    title : "Report A Problem",
    url : "#reportaproblem-page"
} ];  
function createmenuPnl() {
    var items = '';
    //ul = $(".mainMenu:empty"); 
    var ulStr = "<ul>";
    for (var i = 0; i < mainPanel.length; i++) {
        items += '<li><a href="' + mainPanel[i].url + '"> + mainPanel[i].title
        + '</a></li>';
    }
    ulStr+= items;
    ulStr+='</ul>';
    console.log('The ulStr formed is:'+ulStr);
    $("#cssmenu").append(ulStr);
    $("#cssmenu").trigger( "updatelayout" ); 
}

我想要的只是在列表中动态添加图像图标

你忘记了mainPanel[i].title.之前的单引号,它应该是这样的。

items += '<li><a href="' + mainPanel[i].url + '">' + mainPanel[i].title + '</a></li>';

我们来了问题出在您的循环中

for (var i = 0; i < mainPanel.length; i++) {
    // after '"> need one '
    items += '<li><a href="' + mainPanel[i].url + '">' + mainPanel[i].title
    + '</a></li>';
}