Question

我有以下JQuery选择器，并附加了悬停方法：

$("a[id^='foo']").hover(
  function () {
    $(this).css("color", "#eeeeee");

  }, 
  function () {
    $(this).css("color", "#ffffff");
  }
);

但是，我想改变链接下方的td装饰，其id为'foo'前缀，其前缀为'bar'。澄清：foo1，foo2，foo3和bar1，bar2，bar3。如何确定当前有效的id并在同一个悬停方法中使用其相应的后缀？

技术上在半伪代码中我想实现这个结果

$("a[id^='foo']").hover(
  function () {
    $(this).css("color", "#eeeeee");
        // var x = charAt($(this).id.length-1)
        // $("#bar"+x).css("color", "#eeeeee");
  }, 
  function () {
    // ...
  }
);

我尝试使用$ this.id进行修改，但是我得到了未定义的值。

感谢您的帮助！

Answer 1

使用this.id，而不是$(this).id。技术上$(this).attr("id")也可以工作，但不是一个好主意，因为它通过几个级别的jQuery间接来实现相同的结果。

说明：this是本机DOM元素，包含所有常用属性和方法（例如id，className和addEventListener等等。 $(this)是从该DOM元素创建的jQuery对象，它只有jQuery方法，而不是任何原始属性。

在悬停方法中获取动态选择的id的后缀

1 个答案: