1

我正在创建一个小的动态工具提示功能。

基本上，如果我有这样的链接：

<a href="#" data="xyz">?</a>

使用 qTip，我尝试在 mysql 中查找工具提示表，并根据数据属性中的数据检索提示。

所以：

$('a[data]').qtip({ 
    content: {
       url: '/tooltip.php',
       data: { tipKey: $(this).attr('data') },
       method: 'post'
}
});

问题是，它不起作用。$(this).attr('data') 似乎没有提取属性内的值。

如果我手动更改功能，使其看起来如下所示，它没有问题。

    $('a[data]').qtip({ 
    content: {
        url: '/tooltip.php',
        data: { tipKey: 'xyz' },
        method: 'post'
    }

});

当我试图从数据属性中提取数据时，我错过了什么？我应该做类似的事情：

    $('a[data]').qtip({ 
    content: {
        url: '/tooltip.php',
        data: { tipKey: ''+$(this).attr('data')+'' },
        method: 'post'
    }

});

因为那也没有产生价值！

4

3 回答 3

4

您的代码不起作用，因为this关键字表示正在执行的函数的上下文，并且您在对象文字中使用它。

例如，如果您在$(document).ready事件中执行代码片段，则this关键字将代表文档元素。

您可以遍历选择器并单独初始化每个元素工具提示：

$('a[data]').each(function () {
  var $link = $(this);
  $link.qtip({ 
      content: {
        url: '/tooltip.php',
        data: { tipKey: $link.attr('data') },
        method: 'post'
      }
  });
});

另请注意，该data属性不是标准的，您的页面不会通过W3C Validator。

于 2009-10-12T04:07:53.480 回答
1

这个例子对我有用：

<html>
<head>
<title>Text</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
  alert($("a[data]").text());
});
</script>
</head>
<body>
<a href="#" data="123">abc</a>
</body>
</html>
于 2009-10-12T03:55:00.540 回答
1

您应该尝试访问数据的第 0 个元素。像这样：

data: { tipKey: $("a[data]")[0].data},

编辑：哦，好吧，我明白了，这应该可以作为替代方案。

于 2009-10-12T03:58:43.310 回答