gpt4 book ai didi

javascript - 如何创建一个矩形框,迫使我单击一个选项才能查看更多内容

转载 作者:行者123 更新时间:2023-11-28 09:39:43 25 4
gpt4 key购买 nike

我知道如何注册点击的选项,以及如何显示接下来的内容。

我想做的是这样的:

(不关心设计)现在您需要单击一个选项才能查看下一个内容。

这是一个网站,只需要知道应该使用哪种语言,也许是jquery?如果有的话,有什么可以帮助戒烟吗?不想仅重新加载该框的页面。

我了解 php 以及一些 css 和 html,但 javascript 和 jquery 不是太多。

最佳答案

这是一个例子:

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<style type="text/css">
.choices { padding-left: 30px; padding-right: 30px; margin: 10px; }
.enabled { background-color: #ff0000; color: #FFFF00 }
.disabled { background-color: #ddd; color: #fff }
.choosed { background-color: #ffd; color: #000 }
.options { display:none; background-color: #fffff0}
</style>
<script type="text/javascript">
$(document).ready(function() {
$('.choices').addClass('enabled');
$('.choices').click( function(){
$($(this).attr('href')).slideDown();
$('.choices').unbind('click').removeClass('enabled').addClass('disabled');
$(this).removeClass('disabled').addClass('chossed');
})
});
</script>
</head>
<body>
<a class="choices" href="#target1">A</a>
<a class="choices" href="#target2">B</a>
<a class="choices" href="#target3">C</a> <br/>
<div class="options" id="target1">You clicked option A</div>
<div class="options" id="target2">You clicked option B</div>
<div class="options" id="target3">You clicked option C</div>
</body>
</html>

关于javascript - 如何创建一个矩形框,迫使我单击一个选项才能查看更多内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12545596/

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