qtip2工具提示-鼠标跟踪器-如何查找同一类的许多控件的内容？

问题描述

| 我有很多类似下面的控件：

                <div style=\"display: inline;\">
                    <span id=\"cvCaptcha-Target\" class=\"ttTarget\">
                        <asp:CustomValidator ID=\"cvCaptcha\" runat=\"server\" display=\"Dynamic\" OnServerValidate=\"cvCaptcha_ServerValidate\">
                            <asp:Image ID=\"img4cvCaptcha\" CssClass=\"imgValidate\" runat=\"server\" AlternateText=\"attention\"
                                ImageUrl=\"~/Images/Login/Exclamation.png\" />
                        </asp:CustomValidator>
                    </span>
                    <div id=\"cvCaptcha-Content\" class=\"ttContent\">
                       captcha is incorrect!!!
                    </div>
                </div>

如您所见，我将每个控件的ttContent放在它的下面（在div内），并且我有很多带有ttTarget类的控件... 鼠标跟踪器工具提示的qtip2代码如下所示：

        $(\'#target\').qtip({
            content: \'i am tool tip\',position: {
                my: \'top left\',target: \'mouse\',viewport: $(window),// Keep it on-screen at all times if possible
                adjust: {
                    x: 10,y: 10
                }
            },hide: {
                fixed: true // Helps to prevent the tooltip from hiding ocassionally when tracking!
            },style: \'ui-tooltip-shadow\'
        });

当我们将id用作qtip时，每件事都很简单，我们可以轻松找到目标的内容！ 但是在我的情况下，我有很多id，我不知道如何通过上层代码识别它们的内容！ 我的意思是 ：

        $(\'.ttTarget\').qtip({
            content: \'______________\' -> here is my problem (how can i find ttContents),style: \'ui-tooltip-shadow\'
        });

提前致谢     

解决方法

        方式1：

$(function () {
            $(\'.ttTarget\').qtip({
                overwrite: false,content: {
                    text: function (api) {
                        return $(this).parent(\'div\').find(\'div.ttContent\').html();
                    }
                },position: {
                    my: \'top left\',target: \'mouse\',viewport: $(window),adjust: {
                        x: 10,y: 10
                    }
                },hide: {
                    fixed: true
                },style: \'ui-tooltip-shadow\'
            });

方式二：

    $(\'.ttTarget\').live(\'mouseover\',function (event) {
        //alert($(this).next(\'div.ttContent\').text());
        //alert($(this).parent(\'div\').find(\'div.ttContent\').html());
        $(this).qtip({
            overwrite: false,content: $(this).parent(\'div\').find(\'div.ttContent\').html(),position: {
                my: \'top left\',adjust: {
                    x: 10,y: 10
                }
            },hide: {
                fixed: true
            },show: {
                event: event.type,ready: true
            },style: \'ui-tooltip-shadow\'
        },event);
    });