jquery - 如何在div标签中打印文本

Question

我想在 div 标签上打印文本。这里我有三个数组。x_array 和 y_array 是 x 和 y 值的坐标，而 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元素，也可以为这些元素使用类。