Question

我有一个菜单，当它在移动版本打开时，它不会在点击链接时关闭，所以我会输入一个高度：div格式的2px来关闭菜单。

我正在尝试执行以下操作，但无法正常工作：

<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
    <li><a class="active" href="index.html"><span></span>Link 01</a></li>
    <li><a href="index.html"><span></span>Link 02</a></li>
    <li><a href="index.html"><span></span>Link 03</a></li>
</ul>
</div>

<script>
 $('.navbar-collapse collapse').on('click', function(){
document.getElementById("teste").style.height = "2px";
});
</script>

Answer 1

试试这个（但导航栏的jquery选择器正确如下所示）

<script>
 $('.navbar-collapse.collapse').on('click', function(){
    $("#teste").css('height','2px');
});
</script>

你可以像下面一样给出多个css prorties

<script>
     $('.navbar-collapse.collapse').on('click', function(){
        $("#teste").css({height : '2px',
      backgroundColor : "#ddd",
      fontWeight: ""
      });
    });
    </script>

JQuery CSS

Answer 2

您的选择器不正确。

使用

$('.navbar-collapse.collapse').on('click', function(){

而不是

$('.navbar-collapse collapse').on('click', function(){

当您使用多个类时，只需将选择器一起写入

之间没有空格

如何更改或添加样式属性onClick事件

2 个答案: