0

OK、ループごとに名前を 1 ずつ増やす 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 には、ループごとに数値を 1 ずつ増やすステートメントがあります。正常に動作します！これで、linkdiv にカーソルを合わせると divTwo が表示される関数がヘッダーに追加されました。

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

私が持っているもので動作するようにこの機能を適応させることは可能ですか? ループ内で関数を移動しようとしましたが、うまくいかないようです

4

5 に答える 5

3

starts withセレクターを使用できます。次のことを試してください。

指定された文字列で始まる値を持つ、指定された属性を持つ要素を選択します。

$('div[id^=linkdiv]').hover(function() { 
    $(this).find('div').show(); 
}, function() { 
    $(this).find('div').hide(); 
});
于 2012-07-23T10:22:37.570 に答える
0

マークアップに変更を加え、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();
});
于 2012-07-23T11:03:08.503 に答える
0

より良い方法は、すべての div にクラスを与えることです

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

これで、トリックを使用する必要はありません -

$('div.linkdiv').hover(function() { 
    $(this).find('div').show(); 
}, function() { 
    $(this).find('div').hide(); 
});
于 2012-07-23T10:25:09.903 に答える
0

idsclass同じ使用属性のために、ページ内で明示的に異なる必要があります。

于 2012-07-23T10:23:31.573 に答える
0

未検証

 <script type="text/javascript">
   $(function() {
      $('div[id^="linkdiv"]').hover(function() { 
         $(this).next().show(); 
       }, function() { 
         $('this').next().hide(); 
       });
    });
</script>
于 2012-07-23T10:23:54.137 に答える