JQuery всплывающие подсказки и список из БД с PHP - PullRequest
Новая
       22

JQuery всплывающие подсказки и список из БД с PHP

0 голосов
/ 08 февраля 2012

Привет, я использую скрипт jquery easytooltip и перечисляю таблицу somw из моей базы данных следующим образом: 

<style>
#easyTooltip{
background: #000000;
    width:250px;
    line-height:130%;   
color: #ffffff; 
    }
#easyTooltip p{
    margin:0 0 .5em 0;
    }       
#easyTooltip img{
        padding:1px;
        float:left;
        margin-right:10px;
        }       

#optiuni{display:none;}
</style>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/easyTooltip.js"></script>
<script type="text/javascript">
    $(document).ready(function(){   
        $("a#link").easyTooltip({
            useElement: "optiuni"                  
        });
    });
</script>
<div id='item_catalog'>
<table>
<tr>
<td><a id='link'>< img src /template/ezra/images/items_info/$row[12].png ></a></td>
<td>
<div  id='optiuni'><table align='center'>
<tr>
<td align='center'><span class='text1'>Excellent $row[1] $type</span></td>
</tr>
<tr>
<td align='center'><span class='text2'>$def_pwr $row[2]</span></td>
</tr>
<tr>
<td align='center'><span class='text3'>Durability: [$row[4]/$row[4]]</span></td>
</tr>
<tr>
<td align='center'><span class='text3'>Speed: $row[3]</span></td>
</tr>
<tr>
<td  align='center'><span class='text3'>Level Requirement: $row[5]</span></td>
</tr>
<tr>
<td  align='center'><span class='text3'>Strenght Requirement: $row[6]</span></td>
</tr>
<tr>
<td  align='center'><span class='text3'>Agility Requirement: $row[7]</span></td>
</tr>
<tr>
<td  align='center'><span class='text3'>Vitality Requirement: $row[8]</span></td>
</tr>
<tr>
<td  align='center'><span class='text3'>Energy Requirement: $row[9]</span></td>
</tr>
<tr>
<td  align='center'><span class='text3'>Command Requirement: $row[10]</span></td>
</tr>
<tr>
<td style='background:#a00000;' align='center'><span class='text3'>Class Requirement: $clasa</span></td>
</tr>
<tr>
<td align='center'><span class='text4'>$opt</span></td>
</tr>
</table></div>
</td>
</tr>
</table>
</div>

но у меня есть какая-то проблема, всплывающая подсказка появляется только для 1-й строки :( во второй 3-й строке нет подсказки, почему?

1 Ответ

0 голосов
/ 08 февраля 2012

Вы сказали плагину создать всплывающую подсказку для каждого $("a#link"). Но есть только один элемент с этим идентификатором. (Вы не можете иметь несколько элементов с одинаковым идентификатором)

Попробуйте с помощью селектора классов. Пример: $('.text3')

Обновленный ответ:
изменить <div id='optiuni'> на <div class="tooltip-content">
изменить <a id='link'> на <a class='link'> 

$(document).ready(function(){   
    $('.link').each(function(){
        var that = $(this);
        that.easyTooltip({
            content: that.parent().parent().find('.tooltip-content').html()                  
        });
    });
});
...