Отключить открытие подменю в меню jquery при наведении

Я использую меню jquery в своем приложении. У меня есть 3 уровня подменю. Как показано в jsfiddle ниже.

http://jsfiddle.net/ankitap/WC3bE/

Когда мы наводим указатель мыши на опции меню, автоматически открывается подменю. Я хочу отключить эту функцию и хочу открывать подменю только при нажатии. я пытался использовать:

$( "#menu a" ).menu({ role: null });

Я также попытался указать имя класса уровня 1 в качестве основного класса и имя класса уровня 2 в качестве подкласса.

      <script>
      $("#menu").menu();
      $("#menu a").click(function() {
      console.log($(this).text()); // gets text contents of clicked li
      $(".subclass a").show();  
      });

      $("#menu a").click(function() {
      $(".subclass a").hide();
      });
      </script>

HTML-код для этого:

<ul id="menu" class="mainclass">
  <li><a href="#">Aberdeen</a></li>
  <li><a href="#">Ada</a></li>
  <li><a href="#">Adamsville</a></li>
  <li><a href="#">Addyston</a></li>
  <li>
    <a href="#">Delphi</a>
    <ul class="subclass">
      <li >
          <a href="#">Ada</a>
          <ul>
              <li>
                  <a href="#">ankita</a>              
              </li>
          </ul>    
      <li><a href="#">Saarland</a></li>
      <li><a href="#">Salzburg</a></li>
    </ul>
  </li>
  <li><a href="#">Saarland</a></li>
  <li>
    <a href="#">Salzburg</a>
    <ul class="subclass">
      <li>
        <a href="#">Delphi</a>
        <ul>
          <li><a href="#">Ada</a></li>
          <li><a href="#">Saarland</a></li>
          <li><a href="#">Salzburg</a></li>
        </ul>
      </li>
      <li>
        <a href="#">Delphi</a>
        <ul>
          <li><a href="#">Ada</a></li>
          <li><a href="#">Saarland</a></li>
          <li><a href="#">Salzburg</a></li>
        </ul>
      </li>
      <li><a href="#">Perch</a></li>
    </ul>
  </li>
  <li><a href="#">Amesville</a></li>
</ul>

Я не мог остановить открытие подменю при наведении мыши. Я хочу, чтобы подменю открывалось только после нажатия. Пожалуйста, помогите! Спасибо.


javascript jquery submenu jquery-ui jquery-ui-menu
person LearningToCode    schedule 27.09.2013    source источник

Ответы (1)


arrow_upward
5
arrow_downward

нет гуру js/jquery, но, возможно, отменить привязку событий mouseenter и mouseleave

$("#menu").menu(/*{
select: function( event, ui ) {
  var selection = ui.item.text();
  var  get=this.event;
  console.log(get);
}}*/);
$('#menu').unbind('mouseenter mouseleave');
$("#menu a").click(function() {
  console.log($(this).text());
});

обратите внимание на оператор $('#menu').unbind('mouseenter mouseleave');

person gwillie    schedule 27.09.2013