显示使用for循环的多个时间的相同的div标记

Question

我想用for循环显示具有相同div标记的不同文本。意味着如果我有三个文本，我会分别显示每个带有相同div标签的文本。我有三个阵列。前两个数组包含基于这些文本的x和y cooridantes将分别显示在div标签上。以下是我的代码。

var i=1; 
    for(var l=0;l<5;l++){ 
     $("#dimg1").attr('id','dimg'+i) 
     $("#test").attr('id','test'+i) 

     var st1=new Array(); 
     var st2=new Array(); 
     var st3=new Array();   

     st1=[120,150,190,250]; 
     st2=[130,170,220,280]; 
     st3=[Text1,Text2,Text3,Text4]; 
     $(document).ready(function(){ 
     $("#dimg1").hover(function(){  
      i++; 

      for(var j=0;j<3;j++) 
      { 
       var X=st1[j];  
       var Y=st2[j]; 
       var txt=st3[j];  

       var test = $("<span class='test'+j></span>"); 

       test.html(txt); 
       $(this).append(test.offset({left:X,top:Y})); 
       //alert(i); 
      } 

     }, function(){ 
       $(".test").remove(); 
     } 
    ); 

     }); 
    } 

ü也看到输出

<div id="dimg1" class="dimg1" style=" border-color: #36C; border-style: dotted; width: 300px; height: 300px"></div> 

Answer 1

你必须做出4个师，3隐藏。

然后，您可以加载文本并适当地隐藏它们。

Here is what I come up with

脚本

$("#myimg1").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=1;i<4;i++) 
     { 
      var X=x1[i-1]; 
      var Y=y1[i-1]; 
      var txt=txt1[i-1]; 
      var test = $("<span class='test'></span>"); 
      test.html(txt); 

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

$('.myimgcls').show(); 
}, function() { 

    $('.test').remove(); 
$('.myimgcls').not('.firstimg').hide();  
}); 

CSS：

.myimgcls { 
    width:200px; 
    height:200px; 
    border:2px dashed #f30; 
    position:relative; 
} 

.test { 
    display:block; 
    position:absolute; 
} 

的Html

<div id="myimg1" class='myimgcls firstimg'></div> 
<div id="myimg2" class='myimgcls' style="display:none"></div> 
<div id="myimg3" class='myimgcls' style="display:none"></div> 
<div id="myimg4" class='myimgcls' style="display:none"></div>