为什么我的图标不显示？

Question

这是完整项目的 zip QuickLinks.v4

我一直在合作一个项目，但我们遇到了一个问题，我们希望所有图标都有一个右键单击菜单，其中有几个选项，每个图标都是唯一的。我们快完成了，但现在图标还没有被绘制到屏幕上。我们当时只处理前 5 个。这是我第一次使用 jQuery，如有任何帮助，我将不胜感激。

我现在 post 个我认为相关的项目。

icon.html

<a target="_blank">
    <img class="icons" />
    <div class="data">
           <div>
                 <input type="hidden" class="login" />
                 <input type="hidden" class="username" />
                 <input type="hidden" class="password" />
           </div>
    </div>
</a>

icon.js

function buildIcons() {
    var icons = [
        ["https://discordapp.com/", "discord-icon", "icons/discord.png", "social", "Discord", 
            [
                 ["Main Account", "lela_null", "somepass"], 
                 ["Bot Account", "Uta Yuki", "somepass"]
            ]
        ],
        ["https://www.youtube.com/", "youtube-icon", "icons/youtube.png", "social", "YouTube", 
            [
                 ["Main Account", "lela@email", "somepass"], 
            ]
        ],
        ["https://www.facebook.com/?sk=h_chr", "facebook-icon", "icons/facebook.png", "social", "Facebook", 
            [
                 ["Main Account", "lela@email", "somepass"], 
            ]
        ],
        ["https://www.twitter.com/", "twitter-icon", "icons/twitter.png", "social", "Twitter", 
            [
                 ["Main Account", "lela@email", "somepass"], 
            ]
        ],
        ["https://mg.mail.yahoo.com/neo/launch?.rand=8647i3s40jpvp", "ymail-icon", "icons/ymail.png", "social", "Yahoo Mail", 
            [
                 ["Main Account", "lela@email", "somepass"], 
            ]
        ]
    ];
  
    
    
    $.get('data/icon.html', function(data) {
        var icon;
        icons.forEach(function(iconData, index, array) {
            console.log(index);
            icon = $(data).insertAfter("#" + iconData[3]);
            $(icon).find("img").attr("src", iconData[2]);
        });
    });
};

script.js

/* get icon id */
function buildMenu(iconId) {
    $("#remove").click(function() {
       $("#" + iconId).hide();
       cancel();
    });
    $("#menu-title").text($("#"+iconId).data("name"));
    $("#site-link").attr("href", $("#" + iconId).parent().attr("href")).click(cancel);
    switch(iconId) {
    };
}

/* set right click for icons */
$(document).ready(function() {
    buildIcons();
    $(".icons").on("contextmenu", function(e) {
        buildMenu(this.id);
        $("#contextmenu").show().css({
            top: e.clientY,
            left: e.clientX
        });
        e.preventDefault();
    });
});

function cancel() {
    $("#contextmenu").hide();
}

文件和代码较多，如有需要，可在上方下载。

控制台还在我的 jQuery.js 文件中显示 TypeError: a is null。

Answer 1

检查这个

$.get('data/icon.html', function(data) {
    icons.forEach(function(iconData, index, array) {
        console.log(index);

        // Get 'data' as jQuery object
        var $data = $(data);

        // Find image tag and set source
        $data.find('img').attr('src', iconData[2]);

        //Finally put it on page
        $data.insertAfter("#" + iconData[3]);
    });
});

Answer 2

jQuery 无法从另一个文件中包含 html。

为什么我的图标不显示？

Why are my icons not showing up?

html

javascript

jquery

contextmenu