结合两个或多个功能答案

【问题标题】：Combine two or more functions结合两个或多个功能
【发布时间】：2012-02-28 21:52:40
【问题描述】：

我有 10 张图片，每张图片都有 1-10 级，我怎样才能使该功能适用于每个班级？适用于 class="1"。只是不确定如何将它们加在一起？

<body>
<div>
    <img src="img/13-01_basic_hover.jpg" class="1" width="220" height="184" title="huge, gigantic">
    <img src="img/13-01_basic_hover.jpg" class="2" width="220" height="184" title="Number 2">
</div>
<div class="project"></div>
<script>
var title = $(".1, .2").attr("title");
$(".project").text(title);
$(document).ready(function () {
    $(".project").fadeTo(0,0);
    $(".1, .2").hover(
        function () {
            $(".project").stop(true).fadeTo("normal",1);
        }, 
        function () {
            $(".project").fadeTo("normal",0);
        }
    );       
});
</script>
</body>

【问题讨论】：

检查jsfiddle.net/skram/qQANX -> 我刚刚在那里替换了我的代码..

标签： jquery function var

【解决方案1】：

只需将它们添加为逗号分隔值，

$(".1, .2, .3, .4, .5, .6, .7, .8, .9, .10").hover(
  function () {
    $(".project")
        .text(this.title)
        .stop(true).fadeTo("normal",1);
  }, 
  function () {
    $(".project").fadeTo("normal",0);
  }
);

或者为这些元素添加另一个类并将它们分组，然后你就可以了，

$(".grouped").hover(
  function () {
     $(".project")
        .text(this.title)
        .stop(true).fadeTo("normal",1);
  }, 
  function () {
   $(".project").fadeTo("normal",0);
  }
);

【讨论】：

谢谢，我试过了。但是当我将鼠标悬停在第二张图片上时，我会从第一张图片中获得标题？
@ScottPedder 那是因为你在外面设置了标题..检查我编辑的代码。
谢谢，但同样的故事？我想为每个图像保留一个单独的类名？
@ScottPedder 即使第一种方法仍然适用于您..但是您可以将多个类设置为 class="1 grouped"。
我尝试了第一种方法，但似乎什么都没有发生？即 .project 应该淡出到 0？

【解决方案2】：

以数字开头的类名无效。你应该改变它。

无论如何，类名通常用于选择项目组。只需为所有项目添加第二个类名并使用它而不是 .1。

【讨论】：

谢谢，但是当我将鼠标悬停在图像 2 上时，仍然显示图像标题？