gpt4 book ai didi

javascript - 使用 div 外部的按钮更改 div 的内容?

转载 作者:行者123 更新时间:2023-12-02 17:11:21 26 4
gpt4 key购买 nike

这个问题是之前提出的问题的后续问题。

这是我的代码块:

<head>    
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<div>
<a class="link" href="#about" data-link="first">Instructions</a> &#8226;
<a class="link" href="#about" data-link="second">Video</a> &#8226;
</div>
<div>
<div class="instruction_type" data-link="first">
<p>TEXT 1</p>
</div>
<div class="instruction_type" data-link="second">
<p>TEXT 2</p>
</div>
</div>
</body>
<script type="text/javascript">
$('.instruction_type').hide();

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

功能齐全!但是,目前,您加载页面并看到两个可点击的链接:“说明”和“视频”。该页的其余部分是空白的。

我希望页面默认为“说明”,然后如果您单击“视频”,它会更改页面的内容。

需要明确的是:功能代码,希望页面在加载时显示说明。

最佳答案

只需将此代码添加到 JavaScript 末尾即可:

$('.link:first').click();

这样,当页面加载时,将单击第一个按钮..

你的 JavaScript 代码将是这样的:

$('.instruction_type').hide();


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

$('.link:first').click();

关于javascript - 使用 div 外部的按钮更改 div 的内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24788286/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com