1

リンクをクリックするとポップアップが表示される次のqtipコードがあります。「test2」に等しいIDのリンクがクリックされたかどうかをコードから抽出できるjqueryを使用する方法はありますか?

どうもありがとう、ジェームズ

<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 を割り当てると、1 回しか発生しない可能性があるため、制限が生じる場合があります。

おそらく、要素とともに data- 属性 (この場合は 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

私は本当にあなたが望むものを手に入れることができるかどうかわかりません.

qtip ツールチップでデータを選択する方法を示すjsFiddle ( http://jsfiddle.net/neysor/YCTzb/ ) コレクションを用意しました。すべて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 に答える