Question

我使用qtip2 jQuery插件来显示图像地图的工具提示。所有区域都分配了ID，每个工具提示的内容的ID为＆＃34; area-id＆＃34; +＆＃34; -text＆＃34;。例如：

<area id="1" coords="159,32,255,2" shape="poly" href="#" />
<p id="1-text">Lorem ipsum dolor sit amet</p>

我想要实现的是通过获取区域的ID并添加＆＃34; -text＆＃34;来获取每个工具提示的内容。后缀。以下是插件语法的示例：http://jsfiddle.net/craga89/G2sqU/

现在我有这个：

jQuery(document).ready(function () {
    var myId = jQuery(this).attr('id');
    jQuery('area').qtip({
        content: {
            text: ('#' + myId + '-text')
        },
        position: {
            style: {
                classes: 'dealer'
            },
            target: 'mouse',
            adjust: {
                mouse: false
            }
        }
    });
});

但工具提示内容显示为＆＃34; #undefined-text＆＃34; - 显然我的方法不起作用？

有没有人有如何修复上面的代码？

Answer 1

this是DOM就绪处理程序中的document对象，因此attr('id')的{{1}}将被取消定义。

您需要使用document循环将qtip应用于每个area，以便为每个each元素设置一个上下文。然后，您可以为每个area应用qtip适当的设置。

area

<强>更新

注意：您可以使用以下快捷方式 DOM ready handler 来提供本地作用域jQuery(document).ready(function () { jQuery('area').each(function () { var myId = jQuery(this).attr('id'); jQuery(this).qtip({ content: { text: $('#' + myId + '-text').text() }, position: { style: { classes: 'dealer' }, target: 'mouse', adjust: { mouse: false } } }); }); });，并将您的代码缩短为$的传统jQuery使用（无冲突）：

如何在jQuery中获取对象ID并将其与其他字符串组合？

1 个答案: