Question

我创建了非常简单的响应式导航，但它不会响应我的javascript。这是我的逻辑还是我编码错了。我不明白。

当导航变为设备大小时，它会显示响应式样式，但在单击菜单后不会触发触发器。

这是我的javascript

$(function() {
    var pull        = $('#pull');
        menu        = $('nav ul');
        menuHeight  = menu.height();

    $(pull).on('click', function(e) {
        e.preventDefault();
        menu.slideToggle();
    });
});

#pull是变为设备大小之前display: none的触发器并且nav ul display在转换为设备尺寸之后block为display: none。

我错过了什么吗？

Answer 1

似乎点击功能没有触发，尝试这样的事情

＆＃13;

$(document).ready(function() {
  $(function() {
      var pull        = $('#pull'),
          menu        = $('nav ul'),
          menuHeight  = menu.height();

      $(pull).click(function(e) {
          e.preventDefault();
          alert('here');
          menu.slideToggle();
      });
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="pull">
click me
</div>
<nav><ul>
<li>nav test</li>
</ul></nav>

＆＃13;

响应式导航菜单javascript无法正常工作

1 个答案: