0

我正在使用 qTip 插件为 alt 和 title 标签创建工具提示。这样做的原因是因为在我正在处理的应用程序中，我无法将图像上的所有 alt 标签都转换为标题标签，因此必须同时使用两者：

例如

$('*[title]').qtip({
        content: {
            attr: 'title'
        },
        hide: {
            fixed: false,
            event: 'click mouseleave'
        },
        position: {
            target: "mouse",
            adjust: {
                x: 20,
                y: 10,
                method: "flipinvert flipinvert"
            },
            container: false,
            viewport: true,
            at: "right center",
            my: "left center"
        },
        style: {
            classes: "ui-tooltip-tipsy",
            tip: {
                corner: false
            }
        }
    });

    $('img[alt]').qtip({
        content: {
            attr: 'alt'
        },
        hide: {
            fixed: false,
            event: 'click mouseleave'
        },
        position: {
            target: "mouse",
            adjust: {
                x: 20,
                y: 10,
                method: "flipinvert flipinvert"
            },
            container: false,
            viewport: true,
            at: "right center",
            my: "left center"
        },
        style: {
            classes: "ui-tooltip-tipsy",
            tip: {
                corner: false
            }
        }
    });

不过，我遇到的问题是，如果我有一个带有包含图像的标题的链接，我将得到两个工具提示，这是不正确的行为。

我的想法是做一些逻辑检查，如果我悬停的元素有一个标题标签或替代标签，那么只做一个或另一个，而不是两者。

因此，例如，如果<a href="#" title="Tooltip info"><img src="#" alt="Tooltip info"></a>在这种情况下它应该使用 alt 或 title 标记。

任何人都可以帮忙吗？谢谢

例子：

$('a').hover(function() {

if($(this).attr('title')) {
// dont run the alt tag tooltip code
}
});
4

2 回答 2

3

您可以将以下选择器用于第一个

$('*[title]:not(:has([alt]))').qtip({.....

它将做的是，它将选择所有具有属性的元素，这些元素title没有任何具有alt属性的子元素。

于 2012-06-29T10:37:47.677 回答
1

试试这个：

$('*[title]:not(:has([alt]))').qtip({
  // code
});

将在标签 has 中过滤title并排除那些 child has alt。

于 2012-06-29T10:31:30.687 回答