gpt4 book ai didi

javascript - 单击按钮时的 Jquery 切换 div - 不切换

转载 作者:行者123 更新时间:2023-11-28 17:29:52 24 4
gpt4 key购买 nike

我正在尝试让一个 div 在您单击其上方的按钮时进行切换。我不确定我的代码有什么问题,但它不起作用。

在正确的位置使用样式标签进行编辑。代码仍然无法正常工作。

CSS 文件:

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script type="text/javascript">
/*CV Script*/

<script>$(document).ready(function(){
$('#button8').click(function(){
$('#conference8').toggle('slow');
});
});
</script>
<style>
#conference8 {
padding-left: 4em;
}
.button {
display: inline-block;
padding: 2px;
font-size: .8em;
cursor: pointer;
}
.button:active {
transform: translateY(2px);
}
</style>
</head>

HTML:

<button id="button8">Abstract</button>
<div id="conference8">blah blah blah</div>

最佳答案

您的 CSS 在 <script> 中标签。应该在<style>标签。

<head>
<STYLE type="text/css">
#conference8 {
padding-left: 4em;
}
.button {
display: inline-block;
padding: 2px;
font-size: .8em;
cursor: pointer;
}
.button:active {
transform: translateY(2px);
}

/*CV Script*/
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){
$('#button8').click(function(){
$('#conference8').toggle('slow');
});
});
</script>

</head>

工作示例:

$(document).ready(function() {
$('#button8').click(function() {
$('#conference8').toggle('slow');
});
});
#conference8 {
padding-left: 4em;
}
.button {
display: inline-block;
padding: 2px;
font-size: .8em;
cursor: pointer;
}
.button:active {
transform: translateY(2px);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<button id="button8">Abstract</button>
<div id="conference8">blah blah blah</div>

关于javascript - 单击按钮时的 Jquery 切换 div - 不切换,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37059504/

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