多次点击时的Jquery事件

时间:2013-11-22 19:04:24

标签: javascript jquery onclick tooltip show-hide

我正在尝试点击Tipsy Tooltip节目,并在第二次点击时消失。同样,工具提示未显示在第一个(奇数)点击上。而是在第三次点击时显示。

HTML

<p id="more_pricing_info">
<a id="more_pricing_info_tooltip" rel='tipsy' title='Well hello there' onclick='$("#more_pricing_info a[rel=tipsy]").tipsy("show"); return false;'>
    More Info
</a>
</p>

的Javascript

$(function() {
$('#more_pricing_info').click(function() {
    var clicks = $(this).data('clicks');
    if (clicks) {
        // odd clicks
        $('#more_pricing_info a[rel=tipsy]').tipsy({trigger: 'manual', gravity: 'se'});
    } else {
        // even clicks
    }
        $(this).data("clicks", !clicks);
});
});

1 个答案:

答案 0 :(得分:0)

您的元素需要一个初始的“点击”值,否则第一次拉动它时,您的clicks var 未定义。然后将其设置为!clicks,其结果为 false 。然后,第二次单击时,您的脚本会看到clicks为false,因此它会跳过工具提示并将clicks设置为true。在第3次点击时,您的代码会看到clicks最终为真,并且工具提示会触发。

要为“点击次数”设置初始值,请将此属性添加到锚标记中:

data-clicks="true"

此外,您可能需要删除锚标记中的onclick属性,并让您的javascript代码处理点击事件。

所以,这是你的新锚标记:

<p id="more_pricing_info">
<a id="more_pricing_info_tooltip" data-clicks="true" rel='tipsy' title='Well hello there' >
    More Info
</a>
</p>