如何在div标签内打印文本

Question

我想在div标签上打印文本。这里我有三个数组。 x_array和y_array继承x和y值的cooridantes，txt_array包含文本。基于文本的x和y坐标文本将在div标签中显示。下面的代码会显示预期的输出，但它只会显示最后一个数组元素。剩下的将被删除。我想显示基于x和y坐标的所有文本。请帮助我。

<script> 
     var i=0; 
     // var obj={"A","B","C","D"}; 
    $(document).ready(function(){ 
$("#myimg").hover(function(){ 

    var x1=["50","100","150","200"]; 
    var y1=["50","100","150","200"]; 
    var txt1=["Text1","Text2","Text3","Text4"]; 
    var i=0; 

    for(var i=0;i<4;i++) 
     { 

    var X=x1[i]; 
    var Y=y1[i]; 
    var txt=txt1[i]; 

     $("#myimg").append($("#test").offset({left:X,top:Y}));      
     $("#test").html(txt); 


    } 

}); 
}); 
    </script> 

Answer 1

的ID 必须是唯一的。请尝试使用classes代替。

即使允许多个ID，您使用.html()也会覆盖所有#test元素的HTML。你需要通过脚本动态创建的元素：

var test = $("<span class='test'></span>"); 
    test.html(txt); 
    $("#myimg").append(test.offset({left:X,top:Y})); 

同样的，如果你有多个#myimg元素，对于那些使用类了。