Question

当屏幕小于35em时，我试图制作一个简单的按钮来显示和隐藏菜单。但问题是我的jQuery点击事件不会改变列表项的显示值。

CSS：

div{
  list-style:none;
  width:100%;
  text-align:center;
}
ul li{
  display:inline-block;
}
#menuToggle {
  display:none;
}
@media screen and (max-width: 35em) {
  #menuToggle {
    display:block;
    cursor:pointer;
  } 
  ul li{
    display:none;
  }
}

jQuery的：

$('#menuToggle').click(function(){
  $('ul li').css('display','block');
}

演示：http://jsfiddle.net/bLamG/

我该如何确定？

Answer 1

您的代码应该可以运行，但是您没有关闭);，因此您的代码会抛出语法错误。试试这个：

$('#menuToggle').click(function () {
    $('ul li').css('display', 'block');
});

Updated fiddle

Answer 2

您错过了结束);

您也应该使用'on'方法。

$('#menuToggle').on('click', function () {
     $('ul li').css('display', 'block');
});

无法在点击时使用jquery更改显示值

2 个答案: