我的jQuery代碼有什麼問題？

-2

這是一些基本的jQuery，但它不起作用。我有數據庫中每個視頻的描述。非常簡單，當你將鼠標懸停在信息按鈕上時，每個視頻的描述都會淡入。它不工作？爲什麼？我的jQuery代碼有什麼問題？

<script> 
    $(document).ready(function(){ 
     $('.infoBtn').mouseenter(function(){ 
      $('.relatedVideoDescription', this).fadeIn(); 
     }); 
    }); 
    </script>

HTML

<div class="relatedvideo" style=" line-height: 138%;"> 
        <div style="float: left; width: 38%;"> 
         <img src="'.URL.'images/uploads/'.$img_url2.'" width="190px" /> 
        </div><div class="relatedText"> 
         <strong style="font-size: 12px;">'.$title2.'</strong><br /> 
         <p class="relatedVideoDescription">'.$desc2.'</p> 
         <p class="infoBtn">info</p> 
        </div> 
        <br /><br /><br /> 
       <hr /> 
       </div>

的.relatedVideoDescription被設置爲顯示：無;在CSS中。

來源

2014-01-17 Andrew John

能否請您也表明你的HTML？ jut a guess $（this）.children（'。relatedVideoDescription'）。fadeIn（）; – caramba

假設'relatedVideoDescription'是'infoBtn'的一部分，你試過'$（this）.find（'。relatedVideoDescription'）。fadeIn（）;'？ – MassivePenguin

當然在調用fadeIn（）之前隱藏元素 –

http://jsfiddle.net/7prVd/1/

$(document).ready(function(){ 
     $('.infoBtn').mouseenter(function(){ 
      $(this).closest('.relatedvideo').find('.relatedVideoDescription').fadeIn(); 
     }); 
});

UPDATE

或使用.siblings（）安東說

http://jsfiddle.net/7prVd/2/

$(document).ready(function(){ 
     $('.infoBtn').mouseenter(function(){ 
      $(this).siblings('.relatedVideoDescription').fadeIn(); 
     }); 
    });

來源

2014-01-17 13:10:23 caramba

這很好。我做錯了什麼？ –

@AndrewJohn你正在選擇一個副本，這就是爲什麼它不起作用。你正在尋找的元素就在infoBtn – Anton

@AndrewJohn的旁邊，你以我從未做過的方式使用過這個:-)在上面的mouseenter函數中，$（this）是$（'。infoBtn'）。很多時候，如果我只是嘗試和錯誤，我會strart一個函數，然後在函數內寫$（this）.addClass（'xx'）;只是爲了看看我在哪裏。 – caramba

我的jQuery代碼有什麼問題？

回答

相關問題