javascript - 如何通过使用 jquery 单击相同的元素来启用和禁用滚动？

Question

我想在单击页面的“菜单图标”时禁用滚动，然后在再次单击菜单关闭时再次启用滚动。

我正在尝试这样的事情:

$(document).ready(function(){

  $(".menu").click(function (e) {
    $(".menucontent").show();
    if ( $(".menucontent").is(":visible")) {
      $('html, body').css({ overflow: 'hidden', height: '100%'});
    }else{
      $('html, body').css({ overflow: 'auto', height: 'auto'});      
    }

  });
  });

但我需要一些帮助，因为我是这门语言的新手

Answer 1

你应该用 toggle() 而不是 show

toggle: Display or hide the matched elements.

$(document).ready(function(){
  $(".menu").click(function (e) {
    $(".menucontent").toggle();
      if ( $(".menucontent").is(":visible")) {
        $('html, body').css({ overflow: 'hidden', height: '100%'});
      }else{
        $('html, body').css({ overflow: 'auto', height: 'auto'});      
      }
    });
  });