1

我有以下 qtip 代码，当单击链接时会产生一个弹出窗口。有没有办法使用 jquery 我可以从代码中提取 id 等于“test2”的链接是否被点击？

非常感谢，詹姆斯

<ul>
<li><a id="test1" href="">example 1</a></li>
<li class="PopRequired"><a id="test2" href="">example 2</a></li>
<li><a id="test3" href="">example 3</a></li>
<li><a id="test4" href="">example 4</a></li>
</ul>



$('ul li.PopRequired').each(function () {
    $(this).qtip(
    {
        content: {
            text: '<a href="">example text here',
            title: {
                text: true,
                button: '<img src="/images/close_Icon.gif">'
            }
        },
        position: {
            corner: {
                target: 'rightMiddle',
                tooltip: 'leftMiddle'
            },
            adjust: {
                screen: true
            }
        },
        show: {
            when: 'click',
            solo: true
        },
        hide: 'unfocus',
        style: {
            tip: true,
            border: {
                width: 0,
                radius: 4,
            },
            width: 264,
            height: 195,
            title: { 
                background: '#ffffff'
            },
            lineHeight: '16px'
        }
    })
});
4

2 回答 2

0

您可以在 a-tags 上放置一个点击处理程序，并使用以下方法轻松获取 ID

 jQuery(this).attr('id')

为了检索属性值。

但是，为所有锚标记分配 ID 可能会带来限制，因为它可能只出现一次。

也许更好的是，您还可以使用数据属性（在您的情况下为 ID）与您的元素一起存储您的 id/ref。它将存储为 data-x 属性。

例如：

 <a href="#" data-uniqueid="ABC">my link</a>

您可以使用 $(this).data('uniqueid') 检索的 ID ABC；此刻有人点击了链接。

于 2012-08-01T12:09:36.647 回答
0

我不确定我是否真的得到你想要的。

我为您准备了一个 jsFiddle ( http://jsfiddle.net/neysor/YCTzb/ ) 集合，它展示了如何在 qtip 工具提示中选择数据。全部使用qTip2 库

HTML

<a id="id1" href="#">Text 1</a>
<a id="id2" href="#">Text 2</a>
<a id="id3" href="#">Text 3</a>
<button data-info="This is">Text 4</button>
<button data-info="with more">Text 5</button>
<button data-info="Information">Text 6</button>

Javascript

$(document).ready(function() {
    $('a').button().qtip({
        content: {
            text: function() {
                return "Text: " + $(this).text() + "<br>ID: " + $(this).attr("id");
            },
            title: {
                text: 'Modal qTip for Links',
                button: true
            }
        },
        show: {
            event: 'click',
            solo: true,
            modal: true
        },
        position: {
            my: 'center', // ...at the center of the viewport
            at: 'center',
            target: $(window)
        },
        hide: false,
        style: 'ui-tooltip-light ui-tooltip-rounded'
    });
    $('button').button().qtip({
        content: {
            text: function() {
                return $(this).attr("data-info");
            },
            title: {
                text: 'Modal qTip for Buttons',
                button: true
            }
        },
        show: {
            event: 'click',
            solo: true,
            modal: true
        },
        position: {
            my: 'center', // ...at the center of the viewport
            at: 'center',
            target: $(window)
        },
        hide: false,
        style: 'ui-tooltip-light ui-tooltip-rounded'
    });

});​</p>

于 2012-08-01T13:43:12.763 回答