0

我试图弄清楚如何将以下内容放入循环中，但我运气不佳。

  $('#start_01_trigger').mouseover(function() {
    $('#start_01').css( "color", "#FFF" );
    $('#start_01_trigger').fadeTo("100", 0.4);
  });
  $('#start_01_trigger').mouseout(function() {
    $('#start_01').css( "color", "#68C3AD" );
    $('#start_01_trigger').fadeTo("100", 0);
  });

这是针对日历应用程序的，因此必须迭代 31 次。

关键是我正在使用 Tumult Hype 来构建它，我无法为元素分配一个类。我只能分配 ID，每个 ID 都是唯一的。

这是上面循环的第一次迭代，第二次看起来像这样：

  $('#start_02_trigger').mouseover(function() {
    $('#start_02').css( "color", "#FFF" );
    $('#start_02_trigger').fadeTo("100", 0.4);
  });
  $('#start_02_trigger').mouseout(function() {
    $('#start_02').css( "color", "#68C3AD" );
    $('#start_02_trigger').fadeTo("100", 0);
  });

您可以看到，只有 ID 中的数字发生了变化，没有其他任何变化。

4

1 回答 1

1

您可以使用属性选择器来制作通用事件处理程序：

$('div[id^="start_"][id$="_trigger"]').mouseover(function() {
    var $elem = $('#' + this.id.replace('_trigger', ''));

    $elem.css('color', 'red');
    $(this).fadeTo('100', 0);
});
  • [id^="start_"]仅当id属性以 . 开头时才匹配start_。
  • [id$="_trigger"]仅当id属性以 . 结尾时才匹配start_。
  • 所以最后，它匹配id属性以这两个值开始和结束的元素。
于 2013-04-03T03:18:40.157 回答