Question

如何使用jQuery隐藏除切换按钮以外的所有其他元素？

我正在遍历注释，希望用户使用以下代码分配最佳注释，而其余按钮变为隐藏，而当单击最佳答案以删除“最佳答案”状态时，反之亦然。

@foreach (var item in Model.PostComments)
{ 
   <a title="Assign best answer" id="@item.Id" href="#" class="btn-sm btn-default btn-best"><span class="glyphicon glyphicon-ok"></span></a>
}

<script>
  $(document).ready(function () {
   $('a.btn-best').click(function (e) {
   e.preventDefault();
   $(this).toggleClass("btn-success");
   $.ajax({
    url: '@Url.Action("Best", "Posts")',
    data: { id: this.id }
    });
   });
 });
</script>

Answer 1

您可以使用toggle()隐藏和隐藏按钮元素

$(document).ready(function () {
$('button').click(function (e) {
e.preventDefault();
$(this).toggleClass("btn-success");
//$.ajax({
//url: '@Url.Action("Best", "Posts")',
//data: { id: this.id }
//});
$('button').toggle();
$(this).toggle()
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="a">a</button>
<button id="b">b</button>
<button id="c">c</button>
<button id="d">d</button>
<button id="e">e</button>

Answer 2

您可以使用not（）函数来防止隐藏当前的点击按钮

 $(document).ready(function () {
    $('button').on('click',function (e) {
    e.preventDefault();
    $('button').not($(this)).hide();
    //you also can use toggle Class for hidden
    //$('button').not($(this)).toggleClass('btn-success');

    });
});

当使用jQuery切换一个按钮时，如何隐藏所有按钮？

2 个答案: