jquery mouseenter不能在'a'元素上工作，在h3上工作正常

我有（我相信）一個非常簡單的問題，但無法弄清楚什麼是錯的。該代碼會告訴一切：jquery mouseenter不能在'a'元素上工作，在h3上工作正常

$(".all-products h3").mouseenter(function() { 
    $(this).siblings('p').slideDown(200); 
}).mouseleave(function() { 
    $(this).siblings('p').slideUp(500); 
});

，這是HTML：

<a title="xxx" href="#"> 
    <img src="1.jpg"/> 
    <p>description</p> 
    <h3>header3</h3> 
</a>

這一個工作正常，但爲什麼當我在jQuery的替換用的H3不它的工作，所以它不工作這樣如下：

$(".all-products a").mouseenter(function() { 
    $(this).siblings('p').slideDown(200); 
}).mouseleave(function() { 
    $(this).siblings('p').slideUp(500); 
});

的

來源

2013-02-06 Piotr Ciszewski

我希望我包含所有必要的信息。我沒有找到與問題有關的其他代碼。我相信這個'一個'是錯誤的。或者，也許它不能適用於？不知道。 A設置顯示：塊; –

「全產品」類的HTML在哪裏？ –

一切都在莫：http://cabins.tucado.com/現在全部排序。感謝幫助。 –

因爲您正在使用兄弟姐妹。

試試這個：

$(".all-products a").mouseenter(function(){ 
      $('p', this).slideDown(200); 
      }).mouseleave(function() { 
      $('p', this).slideUp(500); 
     });

來源

2013-02-06 00:23:26 rkrdo

效果不錯！謝謝:) –

$(".all-products a").mouseenter(function() { 
    $(this).find('p').slideDown(200); 
}).mouseleave(function() { 
    $(this).find('p').slideUp(500); 
});

姐弟倆將在同級別中不存在DOM。在你的情況下，你想要.find（）元素或調用children（）。無論哪種方式。

來源

2013-02-06 00:23:13

非常感謝。效果很好。和rkrdo的一樣。謝謝你的幫助:) –

a不是p兄弟，它是p父。嘗試使用.children('p')或.find('p')代替（前者更具體）。

來源

2013-02-06 00:23:44

謝謝，這真的很有用。 –

那麼它似乎主要的問題是，該p元素是不是兄弟a兄弟。您需要替換siblings()與children()

來源

2013-02-06 00:24:20

這對於未來非常有用。謝謝@Mike Brant –

jquery mouseenter不能在'a'元素上工作，在h3上工作正常

回答

相關問題