mein jQuery-Code funktioniert nicht

Question

so versuche ich eine ungeordnete Liste zu machen, wo Sie über einen von ihnen schweben und es ändert sich das Video, das ist mein jQuery-Code: BTW, funktioniert mein jQuery-Code, aber nur die iframe src ändert sich nicht

$(document).ready(function(){ 
$('#qnaul li a').mouseenter(function() { 
    $(this).css("background-color" , "black"); 
    $(this).css("color" , "#c97c00"); 
    $('#ytplayer').attr('src', $(this).find('a').attr('href')); 

}).mouseleave(function() { 
    $(this).css("background-color" , "#c97c00") 
    $(this).css("color" , "black"); 

    }); 
}); 

mein html:

<ul id="qnaul"> 
      <li style="width: 20%;margin-left: 0px;height: 100px;" class="liclass"><a href="http://www.youtube.com/embed/vlZ7Log_uoE">1</a></li> 
      <li style="width: 20%;margin-left: 30px;" class="liclass"><a href="http://www.youtube.com/embed/AFdJzSGab-8">2</a></li> 
      <li style="width: 20%;margin-left: 30px;" class="liclass"><a href="">3</a></li> 
      <li style="width: 20%;margin-left: 90px;" class="liclass"><a href="">4</a></li> 
      <li style="width: 20%;margin-left: 30px;border: 0;" class="liclass"><a href="">5</a></li> 
     </ul> 

mein iframe:

<iframe id="ytplayer" type="text/html" width="640" height="390" allowfullscreen="yes" src="" frameborder="0" style="margin-left: 400px;margin-bottom: 10px;background-color: black;"></iframe> 

Answer 1

Ihr jQuery Kontext ist bereits das <a> Element, so dass Sie nur this.href benötigen, um die href zu extrahieren.

ersetzen:

$('#ytplayer').attr('src', $(this).find('a').attr('href')); 

mit:

$('#ytplayer').attr('src', this.href);