如何在懸停div時顯示html列表？

Question

大家好我試圖當div.it懸停正在顯示才能得到HTML列表[目標對象]。如何，我可以顯示爲list.i嘗試下面的代碼

var type= "x,y,z,a"; 
var active = type.split(","); 
if (active .length == 0) 
    feature.attributes.ShowExceptionType = "display:none"; 
else 

var item, items = []; 
for (var i = 0; i < active .length; i++) { 
    item = {}; 
    item.active = active [i]; 
    items.push(item); 
} 

var main = $("<ul>"); 
var str = ""; 
for (var i = 0; i < items.length; i++) { 
    str += "<li>" + items[i].active + "</li>"; 
} 
main.html(str); 
$(document.body).append(main); 

feature.attributes.HoverContent = $(document.body).append(main); 
"description": "{{localize:iplMap:Mac}} : {ESN}<br/><div style='{ShowExceptionCount}' class='cart' id='append'>{{localize:iplMap:ExceptionType}}: ({ExceptionCount})</div>", 

enter image description here

Answer 1

看到，因爲怎麼看起來像你使用jQuery已經，您不妨使用此：

https://jsfiddle.net/whmzt0nj/1/

我也改變了你的代碼的幾個部分的任何風格的功能原因：

var type= "x,y,z,a"; 
var active = type.split(","); 

if (active.length == 0){ 
    feature.attributes.ShowExceptionType = "display:none"; 
} else { 
    var item, items = []; 
} 

for (var i = 0; i < active.length; i++) { 
    item = {}; 
    item.active = active[i]; 
    items.push(item); 
} 

var main = $("ul"); 
var str = ""; 
for (var i = 0; i < items.length; i++) { 
    str += "<li>" + items[i].active + "</li>"; 
} 

$('#append').html("<ul id='append-list'></ul>"); 
$("#append-list").append(str); 

$('#append-list').hide(); 

$("#append").mouseenter(function(){ 
    $(this).children('#append-list').slideDown(); 
}) 

$("#append").mouseleave(function(){ 
    $(this).children('#append-list').slideUp(); 
})