событие onfocus по ссылке

Question

Я создаю меню, которое управляется CSS, и я столкнулся с проблемой для пользователей клавиатуры. Не существует поддержки кросс-браузера для селектора CSS :focus, поэтому я пытаюсь создать сценарий jQuery, который будет выполнять одно и то же действие.

HTML меню:

<div id="nav"> 
    <ul> 
     <li><a href="/index.asp" tabindex="12">Home</a></li> 
     <li><a href="/aboutus.asp" tabindex="13">About Us</a></li> 
     <li><a href="/whatWeDo.asp" tabindex="14" id="whatWeDo">What We Do</a> 
     <ul> 
      <li><a href="/whatWeDo1.asp">What we do1</a></li> 
      <li><a href="/whatWeDo2.asp">What we do2</a></li> 
     </ul> 
     </li> 
     <li><a href="/testStudies.asp">Test Studies</a></li> 
    </ul> 
</div> 

правила CSS для меню:

#nav ul { 
    padding: 0; margin: 0; 
} 
#nav ul li { 
    list-style: none; 
    font-size: 16px; 
} 
#nav ul li ul li { 
    font-size: 13px; 
} 
#nav ul li ul { 
    display: none; 
} 

.showMenu, #nav ul li:hover ul{width:200px; padding:7px; background: #F2F2F2; border:1px solid #F2F2F2; display: block; position: absolute; left: 85px; top: 30px; } 

Вот код JQuery, что я пытаюсь заставить работать:

$(document).ready(function(){ 
    $('#whatWeDo').focus(function() { 
     $(#nav ul li ul).addClass("showMenu"); 
    }); 
}); 

Answer 1

Вы забыли котировки:

$(document).ready(function(){ 
    $('#whatWeDo').focus(function() { 
           $('#nav ul li ul').addClass("showMenu"); 
      }); 
 }); 

Answer 2

Вы забыли кавычки, то JQuery должен быть:

$(document).ready(function(){ 
    $('#whatWeDo').focus(function() { 
     $('#nav ul li ul').addClass("showMenu"); 
    }); 

Answer 3

Как отмечен в других ответах, окружающий ваш сокровенный селектор с цитатами должны сделать трюк.

Хотя я хотел бы дополнительно указать, что рекомендуется связывать события с помощью функции on(), которая была добавлена ​​в jQuery 1.7. Вот как ваш код будет выглядеть с помощью on():

$(document).ready(function(){ 
    $("#whatWeDo").on("focus", function() { 
     $("#nav ul li ul").addClass("showMenu"); 
    }); 
}); 

Here более подробной информации о on().