0

这是 jQuery 代码：

$("#web").hover(
  function () {
    $(this).css({
             'background-color': '#ecf5fb',
             'cursor': 'pointer',
             'border': '1px solid #378ac4'
           })
           .children("a").children("img").attr("src", "1.png")
           .end().children("p").css("opacity", "1.0");

           $('#commentweb').stop(true, true).fadeIn();
  }, 
  function () {
    $(this).css({
             'background-color': '#e8e3e3',
             'border': '1px solid grey'
             })
             .children("a").children("img").attr("src", "2.png")
             .end().children("p").css("opacity", "0.5");

             $('#commentweb').stop(true, true).fadeOut();
  }
);

问题是不透明度没有改变，而其他一切都正常。但是如果我写的不是这段代码

$(this).css({
         'background-color': '#ecf5fb',
     'cursor': 'pointer',
     'border': '1px solid #378ac4'
       })
       .children("a").children("img").attr("src", "1.png");
$(this).children("p").css("opacity", "1.0");

有用。为什么会这样？

这是小提琴：http: //jsfiddle.net/mMB3F/6/

4

2 回答 2

2

如果你想回到原来的选择，你必须调用.end()两次，因为你在链上调用了两次子项。

$("#web").hover(
  function () {
    $(this).css({
             'background-color': '#ecf5fb',
             'cursor': 'pointer',
             'border': '1px solid #378ac4'
           })
           .children("a").children("img").attr("src", "1.png")
           .end().end().children("p").css("opacity", "1.0");

           $('#commentweb').stop(true, true).fadeIn();
  }, 
  function () {
    $(this).css({
             'background-color': '#e8e3e3',
             'border': '1px solid grey'
             })
             .children("a").children("img").attr("src", "2.png")
             .end().end().children("p").css("opacity", "0.5");

             $('#commentweb').stop(true, true).fadeOut();
  }
);

http://jsfiddle.net/mMB3F/8/

于 2012-08-26T08:18:08.687 回答
1

如果要返回原始 jquery 对象，则需要在其中添加一个额外的 .end() - 每个过滤操作都将一个新的 jquery 对象放在堆栈上 - 每次调用 .end() “弹出”最后一个离开堆栈。这是一个更新的小提琴：http: //jsfiddle.net/mMB3F/7/

于 2012-08-26T08:18:00.997 回答