2017-07-08 200 views
0

这是一个zip到整个项目QuickLinks.v4为什么我的图标不显示?

我一直在合作一个项目,我们都被困在一个问题上,我们希望所有的图标有具有特有的几个选项的右键菜单每个图标。我们差不多已经完成了,但现在这些图标并未被吸引到屏幕上。我们只在当时的前5名工作。这是我第一次使用jQuery,我很感激任何帮助。

我现在会发布我认为相关的项目。

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", "[email protected]", "somepass"], 
      ] 
     ], 
     ["https://www.facebook.com/?sk=h_chr", "facebook-icon", "icons/facebook.png", "social", "Facebook", 
      [ 
       ["Main Account", "[email protected]", "somepass"], 
      ] 
     ], 
     ["https://www.twitter.com/", "twitter-icon", "icons/twitter.png", "social", "Twitter", 
      [ 
       ["Main Account", "[email protected]", "somepass"], 
      ] 
     ], 
     ["https://mg.mail.yahoo.com/neo/launch?.rand=8647i3s40jpvp", "ymail-icon", "icons/ymail.png", "social", "Yahoo Mail", 
      [ 
       ["Main Account", "[email protected]", "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

回答

0

的jQuery没有包括来自另一个HTML文件的能力。

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]); 
    }); 
}); 
+0

结果有明显的差异。 –

+0

您的代码在[测试设置](https://jsfiddle.net/28rgbm92/)上按预期工作。请确保您获得预期的HTML以获取请求到'data/icon.html' –

+0

您是否可以下载项目并查看问题点是否不同? –