Question

好的我有一个div，我在每个循环中将名称增加一个。可能存在无限数量的div，因为它们是新闻循环的一部分

   <?php $i=1; do {?>
 <div id="linkdiv<?php echo $i;?>">
     <div id="divTwo<?php echo $i;?>" style="display: none;"><a href="#">Edit</a></div>
   </div>
  <?php } while($row= mysql_fetch_assoc($rs_query)); ?>

两个div都有一个语句，每个循环将数字增加一个。工作良好！现在我在标题中有一个函数，当你将鼠标悬停在linkdiv上时，它会显示divTwo。

 <script type="text/javascript">
$(function() {
$('#linkdiv').hover(function() { 
    $('#divTwo').show(); 
}, function() { 
    $('#divTwo').hide(); 
});
});
</script>

可以调整此功能以使用我所拥有的功能吗？我已经尝试在循环中移动函数，但这似乎无法正常工作

Answer 1

您可以使用starts with选择器。请尝试以下方法：

选择具有指定属性的元素，其值始于给定字符串。

$('div[id^=linkdiv]').hover(function() { 
    $(this).find('div').show(); 
}, function() { 
    $(this).find('div').hide(); 
});

Answer 2

ids需要在页面中明确区分...对于相同的使用class属性。

Answer 3

未经测试

 <script type="text/javascript">
   $(function() {
      $('div[id^="linkdiv"]').hover(function() { 
         $(this).next().show(); 
       }, function() { 
         $('this').next().hide(); 
       });
    });
</script>

Answer 4

更好的方法是为所有div提供课程

<div class="linkdiv" id="linkdiv23">...</div>

现在你不需要使用任何技巧 -

$('div.linkdiv').hover(function() { 
    $(this).find('div').show(); 
}, function() { 
    $(this).find('div').hide(); 
});

Answer 5

使用jquery更改了标记，更简单和更多选项，您可以使用.linkdiv定位所有内容或使用.linkdiv-X定位，同样适用于.divTwo

  <?php $i=1; do {?>
 <div class="linkdiv linkdiv-<?php echo $i;?>">
     <div class="divTwo divTwo-<?php echo $i;?>" style="display: none;"><a href="#">Edit</a></div>
   </div>
  <?php } while($row= mysql_fetch_assoc($rs_query)); ?>

这应该产生类似

的东西

 <div class="linkdiv linkdiv-X">
     <div class="divTwo divTwo-X" style="display: none;"><a href="#">Edit</a></div>
   </div>

和那个

的jquery

$(".linkdiv").hover(function(){
 $(this).find(".divTwo").show();
},function(){
 $(this).find(".divTwo").hide();
});

将一个节目应用于悬停到更改名称的重复div

5 个答案: