如何触发第一个 link 的点击功能

Question

我是 javascript 的新手，我使用了为网站的菜单 table 找到的这段代码。当您单击选项卡时，它会根据您单击的选项卡在右侧的大框中显示特定内容。

当您加载页面时，右侧框中没有显示任何内容，因为所有内容都被隐藏了。我想要它，以便在您加载页面时已经“点击”了一个选项卡的内容。

$('.linkdetails').hide();

$('.link').click(function() {
     $('.linkdetails').hide();
     $('.linkdetails[data-link=' + $(this).data('link') + ']').fadeIn({
     width: '200px' }, 300);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="menucontainer">      
  <div class="left" >
    <a class="link" data-link="first" href="#">TAB 1         </a>
    <br/>
    <a class="link" data-link="second" href="#">TAB 2</a>
    <br/>      
    <a class="link" data-link="third" href="#">TAB 3 </a>
    <br/>   
   </div>
   <div class="content" >
     <div class="linkdetails" data-link="first" > TAB 1 CONTENT</div>
     <div class="linkdetails" data-link="second" >TAB 2 CONTENT</div>
     <div class="linkdetails" data-link="third" >TAB 3 CONTENT</div>
   </div> 
</div>

Answer 1

这可以通过 localStorage 来完成。只要有它，就可以动态保存单击的 TAB 的状态，这样，在加载页面时，您可以打开之前打开的选项卡。这是一个 link，我相信你可以从这里算出来： https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

Answer 2

您可以使用此代码：

$('.linkdetails').hide();

$('.link').click(function () {
    $('.linkdetails').hide();
    $('.linkdetails[data-link=' + $(this).data('link') + ']').fadeIn({
        width: '200px'
    }, 300);
});

$('.linkdetails[data-link=first]').fadeIn({
    width: '200px'
}, 300);

您可以将 data-link=first 替换为您希望首先打开的 link，例如data-link=third.

如何触发第一个 link 的点击功能

how to trigger click function for the first link

html

javascript

click

onclick