Jquery悬停卡片

Question

我正在使用http://designwithpc.com/Plugins/Hovercard插件，但是我不知道如何在悬停卡片上声明一个变量。每个工作描述都有自己的ID，在悬停标签时应该调用它。我希望我解释得清楚。

<li id="577" class="item">
    <span>
        <h3 class="padding-left"><label class="labeldesc" for="">Text</label></h3>
    </span>
    <span class="job-descr" id="hiden-577">TextTextTextTextText</span>
</li>
<li id="588" class="item">
    <span>
        <h3 class="padding-left"><label class="labeldesc" for="">Text2</label></h3>
    </span>
    <span class="job-descr" id="hiden-588">Text2Text2Text2Text2Text</span>
</li>

Jquery 代码：

$('.labeldesc').hovercard({
    var idhover=$(this).closest('.item').attr('id');
    detailsHTML:$("#hiden-" + idhover).html()
});

- alexandra

Answer 1

试试这个：http://jsfiddle.net/X2q9z/

$('.labeldesc').hovercard({
    onHoverIn: function() {
        var txt = $($(this).parents('li')[0]).find('.job-descr').html();
        $(this).find('.hover_text').html(txt);
    },
    detailsHTML: '<div class="hover_text"></div>'
});

- Ayman Safadi

---

我最终做到了同样的事情，但我使用了var txt = $(this).closest('.item').find('.job-descr').html();。 - balexandre

我知道已经有一段时间了，但我该如何更改cardImgSrc属性？ - Marcel Djaman

Answer 2

首先，你的jQuery代码有问题。在调用hovercard函数时不能使用var关键字。

我已经按照你的要求进行了更新。请查看此链接：http://jsfiddle.net/cnCmN/

$('.labeldesc').each(function(){
    $(this).hovercard({
        detailsHTML: $("#hiden-"+$(this).closest('.item').attr('id')).html()
    });
});

- Qorbani

---

那么这应该是一个更简单、更好的解决方案吗？ - alexandra

这正是基于你的代码的 :-) 就性能而言，这种方式可能更好，因为它不需要在鼠标悬停时进行查找操作。 - Qorbani