jquery - 从函数调用中获取 html 属性

Question

我试图根据锚标记的 id 属性调用不同的工具提示。我的 JavaScript 代码如下：

$(function()
{
   $('.tippy').qtip(
   {
      content: {
          url: "http://mydomain.com/product/mini/" + $(this).attr("id") // doesn't work
      },

      hide: { when: 'mouseout', fixed: true },

       position: {
         corner: {
            target: 'bottomRight',
            tooltip: 'topLeft'
         }
      }
   });

});

我的 html 代码如下所示：

<div>this is the text and I would like to reference the <a href="product.php" class="tippy" id="123456">superproduct</a> with qtip.</div>

我很困难，你能帮我一下吗？

Answer 1

使用each()：

$('.tippy').each(function() {  
   $(this).qtip({
          content: {
              url: "http://mydomain.com/product/mini/" + $(this).attr("id")
          },
          hide: { when: 'mouseout', fixed: true },   
          position: {
             corner: {
                target: 'bottomRight',
                tooltip: 'topLeft'
             }
          }
   });
)};

---

$(this的原因) 在你的代码中不起作用很简单：它不在函数调用内部（至少不在 this 应该引用 .tippy 的地方） 元素）。 $(this).attr() 在构造传递给 qtip() 的对象时执行。这意味着它与 $('.tippy') 处于相同的上下文中，因此 this 最有可能指的是 window。