1 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
<script src="<?php $this->baseUrl()?>/public/js/jQuery.bubbletip-1.0.6.js" type="text/javascript"></script>
<link href="<?php $this->baseUrl()?>/public/js/bubbletip/bubbletip.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
$(document).ready(function() {
    for(i=1;i<12;i++){
    $('#a'+i).bubbletip($('#tip'+i), { deltaDirection: 'right' });
    }
});
</script>

ヘッダー部分のコード

   <?php 
    foreach($this->nominations as $nomination)
            {
        for($i=1;$i<12;$i++){
        if($nomination['award'.$i]!=""){?>
        <div id="tip<?php echo $i?>" style="display:none;">
            <div class="star"><strong><?php echo $nomination['award'.$i];?></strong></div>
            <div><strong>Project: </strong><?php echo $nomination['project'.$i]?></div>
        </div>
     <?php }}
for($i=1;$i<12;$i++){
                    if($nomination['award'.$i]!=""){
                echo "<span id='a$i'>";
                echo "<img src='/public/assets/images/icons/star.png'/>";
                echo "</span>"; 
                }}

}?>

本文セクションのコード

私の問題は、foreachすべての最初の反復の星の上にマウスを置くと正常に機能しているが、2番目の反復からは機能しない場合、問題はid a、tipにあることがわかりました。これは、それらが常にa1、a2 ..およびtip1、tip2になるためです。 ..解決策はありますか

4

1 に答える 1

2

これは、forachループを繰り返すたびに、a1 t a12から同じIDの要素を作成するため、IDの名前に別のレベルを設定する必要があるためです。次を使用してみてください。

<?php
$count=0;
    foreach($this->nominations as $nomination)
            {
            $count++;
        for($i=1;$i<12;$i++){
        if($nomination['award'.$i]!=""){?>
        <div id="tip<?php echo $i?>_<?php echo $count?>" style="display:none;">
            <div class="star"><strong><?php echo $nomination['award'.$i];?></strong></div>
            <div><strong>Project: </strong><?php echo $nomination['project'.$i]?></div>
        </div>
     <?php }}
for($i=1;$i<12;$i++){
                    if($nomination['award'.$i]!=""){
                echo "<span id='a$i_$count'>";
                echo "<img src='/public/assets/images/icons/star.png'/>";
                echo "</span>"; 
                }}

}
<input type="hidden" id="total_iteration" name="total_iteration" value="<?php echo $count?>"/>
?>

それに応じてJavaScriptコードを変更します

<script type="text/javascript">
$(document).ready(function() {

var total=$('#total_iteration').val();
var t=0;
 for(t=1;t<total;t++)
 {

    for(i=1;i<12;i++){
    $('#a'+i+'_t').bubbletip($('#tip'+i+'_'+t), { deltaDirection: 'right' });
    }

    }
});
</script>

上記のコードをいくつかデビッグした後、私はそれをテストしていませんが、主な問題は各反復での重複IDの要素であると思います

于 2012-10-15T12:15:55.767 に答える