Question

这是代码：

  if (urlGid) {
       $('.global_main').hide();
       $('#right-tabs, #right-tabs-content').show();
  } else {
       $('.global_main').show();
       $('#right-tabs, #right-tabs-content').hide();
  }

我觉得这很麻烦，怎么能优雅地改变呢？我可以在没有if else的情况下对其进行编码吗？

Answer 1

是的，您可以使用toggle()。例如：

 $('.global_main').toggle(!urlGrid);
 $('#right-tabs, #right-tabs-content').toggle(urlGrid);

请参阅此处的文档：http://api.jquery.com/toggle/#toggle-display

Answer 2

你可以这样做：

if (urlGid) {
    $('.global_main').hide();
    $('#right-tabs, #right-tabs-content').show();
} else {
    $('.global_main').show();
    $('#right-tabs, #right-tabs-content').hide();
}

Answer 3

也许只是......

$（'。global_main，＃right-tabs，＃right-tabs-content'）。toggle（）;

$( "#toggle" ).click(function() {
$('.global_main, #right-tabs, #right-tabs-content').toggle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div id="right-tabs">right-tabs</div>
<div class="global_main" style="display:none">global_main</div>
<div id="right-tabs-content">right-tabs-content</div>
<button id="toggle">toggle</div>

如何用javascript优化这段代码？

3 个答案: