gpt4 book ai didi

javascript - JS 编码不能在一个以上的页面上工作

转载 作者:太空宇宙 更新时间:2023-11-03 19:27:46 24 4
gpt4 key购买 nike

我是这方面的新手,已经能够让我的代码在我的第一页上运行,但不能在任何其他页面上运行。我试图将它作为导出的 js 文件来做,但它不起作用,所以我将它作为 a 添加到我的 html 页面的底部。现在它只是在那个页面上不起作用!所以这个有效:

* {
font-family: Helvetica, sans-serif;
}
body {
background-position: bottom;
font-family: Arial, Helvetica, sans-serif;
background-color: #e9e9e9;
}
img.sixth {
display: block;
margin: auto;
margin-bottom: 4em;
}

h1.first {
text-align: center;
font-family: arial, helvetica, sans-serif;
padding:10px;
border: Dashed 3px;
border-color: #66CCFF;
width: 300px;
height: auto;
position: static;
margin: 30px;
margin-left: 500px;
margin-top: 40px;
}

h2 {
text-align: center;
font-family: arial, helvetica, sans-serif;
padding:10px;
border: Dashed 3px;
border-color: #66FF66;
width: 300px;
height: auto;
margin: auto;
cursor: pointer;
margin-top: 1.5em;
}

img.first {
display: block;
margin: auto;
margin-bottom: 2em;
display: none;
}

img.second {
display: block;
margin: auto;
display: none;
}

img.third {
display: block;
margin: auto;
display: none;
}

img.fourth {
display: block;
margin: auto;
margin-bottom: 1em;
display: none;
}

img.fifth {
display: block;
margin: auto;
display: none;
}

p {
text-align: center;
font-family: arial, helvetica, sans-serif;
visibility:hidden;
}
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="densi.js"></script>
<link rel="stylesheet" href="C:\Users\Hayley\Documents\Coding\DENSI\densi_home.css">
<title> DENSI 2017 </title>
</head>
<body>
<!--Navigation bar-->
<div id="nav-placeholder">

</div>

<script>
$(function(){
$("#nav-placeholder").load("nav1.htm")
;
});
</script>
<!--Finish NavBar-->

<!--Page Heading-->

<div id='heading'>
<h1 class='first' align='center'><big> DENSI 2017 </h1 class='first' align='center'></big>
</div>

<img class='sixth' src="C:\Users\Hayley\Documents\Coding\DENSI\DEN.jpg"
height="200px"
width="250px"
border="1px"
position="center"
alt=""/>

<!--Section 1-->
<div class="parent">
<h2 align='center'> What is it? </h2>
<p align='center'> DENSI stands for Discovery Education Network Summer Institute. It is a week long residential professional development that helps educators learn, share and connect with other educators about good practice; integrating technology into the classroom and to give different perspectives on strategies to engage children. </p>
<img class='second' src="C:\Users\Hayley\Documents\Coding\DENSI\DENSI.jpg" alt="DEN Group Photo"
height="150px"
width="270px"
border="1px"
style="float: left; margin-left: 30%; margin-bottom:0.5em; margin-top: 3em;"
/>
<img class='third' src="C:\Users\Hayley\Documents\Coding\DENSI\densi logo.jpg" alt="Discovery Logo"
height="250px"
width="180px"
border="1px"
style="float: right; margin-right: 30%; margin-bottom: 1em;"
/>
<p style="clear: both;"></p>
</div>

<!--Section 2-->

<div class="parent">
<h2 align='center'> Where was it held? </h2>
<p align='center'> DENSI this year was held in San Diego at the University of California San Diego. In previous years it has been held in Washington, Chicago and Montana. San Diego has been a beautiful setting for DENSI this year (although there was no air con... and the wifi was a struggle...); once we had adjusted to the heat and the time difference we were well on our way to starting our once in a lifetime professional development experience!</p>
<img class='fourth' src="C:\Users\Hayley\Documents\Coding\DENSI\15.jpg"
height="250px"
width="180px"
border="1px"
alt=""/>
</div>

<!--Section 3-->

<div class="parent">
<h2 class='third'align='center'> Who was there? </h2>
<p class='third' align='center'> There were over 150 attendees at DENSI this year, several of which travelled from Egypt, England, UAE, Dubai, Haiti, Kuwait and China. Information on attendees can be found <span style="cursor:pointer"><a href="https://docs.google.com/presentation/d/1K_mloa69fSR0ij0E7u1pjG_RkCzLxMUTk7JlLd04J2Y/edit"
target="_blank">here.</a>
<p class='fourth' align='center'>
Over the course of the week we had networked with the majority and had connected with many.</p>
<img class='first' src="C:\Users\Hayley\Documents\Coding\DENSI\Int1.jpg" alt="Internation Group Photo"
height="180px"
width="250px"
border="1px"
style="float: inherit; margin-right: 40%; margin-bottom: 5em;"
/>
</div>

<!--Footer-->
<div id="footer">



<script>
$(function(){
$("#footer").load("footer.htm")
;
});
</script>
</div>
<script>
$(".parent").children("h2").click(function(){
$(".parent").children("p", "img.first", "img.second", "img.third", "img.fourth", "img.fifth").css("visibility", "hidden");
$(this).siblings("p", "img.first", "img.second", "img.third", "img.fourth", "img.fifth").css("visibility", "visible");
$(".parent").children("img.first").css("display", "none");
$(this).siblings("img.first").css("display", "block");
$(".parent").children("img.second").css("display", "none");
$(this).siblings("img.second").css("display", "block");
$(".parent").children("img.third").css("display", "none");
$(this).siblings("img.third").css("display", "block");
$(".parent").children("img.fourth").css("display", "none");
$(this).siblings("img.fourth").css("display", "block");
$(".parent").children("img.fifth").css("display", "none");
$(this).siblings("img.fifth").css("display", "block");
});
</script>
</body
</html>

但是我尝试的这个和其他每个都不会:

body {
background-position: bottom;
font-family: Arial, Helvetica, sans-serif;
background-color: #e9e9e9;
}
h1.first {
text-align: center;
font-family: arial, helvetica, sans-serif;
padding:10px;
border: Dashed 3px;
border-color: #66CCFF;
width: 300px;
height: auto;
position: static;
margin: 30px;
margin-left: 500px;
margin-top: 40px;
}
h2 {
text-align: center;
font-family: arial, helvetica, sans-serif;
padding:10px;
border: Dashed 3px;
border-color: #66FF66;
width: 300px;
height: auto;
margin: auto;
cursor: pointer;
}
img.first {
display: none;
margin: auto;
}
img.second{
display: none;
margin: auto;
}
img.third{
display: none;
margin: auto;
}
img.fourth{
display: none;
margin: auto;
}
img.fifth{
display: none;
margin: auto;
}
img.eight{
display: none;
margin: auto;
}
img.ninth{
display: none;
margin: auto;
}
img.tenth{
display: none;
margin: auto;
}
img.eleventh{
display: none;
margin: auto;
}
p {
text-align: center;
font-family: arial, helvetica, sans-serif;
font-size: 11.8pt;
visibility: hidden;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="C:\Users\Hayley\Documents\Coding\DENSI\day1.css">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<title> Day One </title>
</head>
<body>
<!--Navigation bar-->
<div id="nav-placeholder">

</div>

<script>
$(function(){
$("#nav-placeholder").load("nav1.htm")
;
});
</script>
<!-- Heading-->

<h1 class='first' align='center'><big> Day One </h1></big>

<!-- Section One-->

<div class="parent">
<h2 align='center'> Small Group </h2>
<p align='center'> My small group leader was Jen Hall. She was amazing, she saved Nik and I seats so that we were able to meet our small group and made us feel welcome. Our small group were accommodating and likeable. In our small group was Dana, Cheryl, Mary, Leslie, Alexis, Nadine, Chelsea, Kimberly, Lauren, Renee and Lakesha. </p>
<img class='first' src="C:\Users\Hayley\Documents\Coding\DENSI\IMG_0088.jpg" alt="Our Small Group 1"
height="130px"
width="200px"
border="1px"
style="float: left; margin-left: 17%; margin-bottom:0.5em; margin-top: 1em;"
/>
<img class='third' src="C:\Users\Hayley\Documents\Coding\DENSI\IMG_0090.jpg" alt="Our Small Group 2"
height="130px"
width="200px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom:0.5em; margin-top: 1em;"
/>
<img class='second' src="C:\Users\Hayley\Documents\Coding\DENSI\IMG_0089.jpg" alt="Our Small Group 3"
height="130px"
width="200px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom:0.5em; margin-top: 1em;"
/>
<p style="clear: both;"></p>
</div>

<!--Section Two-->
<div id='parent'>
<h2 align='center'> What Did We Do? </h2>
<p> We started off with an opening session. In this session there was a video introducing a new country to the group made by the attendees from that country, and there were discussions about someone people had connected with the previous day as well as the timetable for the day. In the morning we had a session let by Jaime LaForgia and then it was lunch time! <br/> I didn't realise how much I was going to like American food. Turns out it is A LOT.</p>
<img class='fourth' src="C:\Users\Hayley\Documents\Coding\DENSI\14.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<img class='fifth' src="C:\Users\Hayley\Documents\Coding\DENSI\42.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<img class='eight' src="C:\Users\Hayley\Documents\Coding\DENSI\68.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<img class='ninth' src="C:\Users\Hayley\Documents\Coding\DENSI\69.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<p style="clear: both;"></p>
</div>
<!--Section 3-->
<div id='parent'>
<h2 align='center'> International Group </h2>
<p> In the afternoon we went to a different building to be part of the international group meet up. Firstly, we looked at and discussed a powerpoint led by Lance about SOS and how to improve the Discovery software and services in front of the CEO, Bill Goodwyn. While in the room we had to introduce ourselves; say our name, where we worked, discuss our school community and/or how we use Discovery software in our school. Except I didn't. I stayed quiet, sat back in my chair and took in everything everyone else was saying, listened and just did not introduce myself; because I don't enjoy big groups. Thankfully, Christine let me get away with this, saved me the embarrassment and let me stay in my comfort zone. </p>
</div>

<!--Section 4-->
<div id='parent'>
<h2 align='center'> The DEN at Night... </h2>
<p> At night, the DEN becomes a different place. It becomes less professional and more... personal and party-vibey. Alcohol is found and everyone becomes less tense, people relax, make friends, network in ways we can't during the day. During the DEN at Night I made friends with an awesome group of people, including Kelli, Heather and Kamala. These are my newest life-long friends.:)</p>
<img class='tenth' src="C:\Users\Hayley\Documents\Coding\DENSI\13.jpg"
height="150px"
width="250px"
border="1px"
style="float: left; margin-left: 30%; margin-bottom: 5em;"
alt="American Friends and I"/>
<img class='eleventh' src="C:\Users\Hayley\Documents\Coding\DENSI\72.jpg"
height="250px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Friends and I"/>
<p style="clear: both;"></p>
</div>

<!--Footer-->
<div id="footer">

</div>

<script>
$(function(){
$("#footer").load("footer.htm")
;
});
</script>
<script>
$(".parent").children("h2").click(function(){
$(".parent").children("p").css("visibility", "hidden");
$(this).siblings("p").css("visibility", "visible");
$(".parent").children("img.first", "img.second", "img.third").css("display", "block");
$(this).siblings("img.first", "img.second", "img.third").css("display", "block");
$(".parent").children("img.fourth", "img.fifth", "img.eight", "img.ninth").css("display", "block");
$(this).siblings("img.fourth", "img.fifth", "img.eight", "img.ninth").css("display", "block");
$(".parent").children("img.fourth", "img.fifth", "img.eight", "img.ninth").css("display", "block");
$(this).siblings("img.tenth", "img.eleventh").css("display", "block");
});
</body>
</html>

最佳答案

您缺少脚本标记的结尾,请添加 </script>对于第二个代码或尝试下面的代码。

body {
background-position: bottom;
font-family: Arial, Helvetica, sans-serif;
background-color: #e9e9e9;
}
h1.first {
text-align: center;
font-family: arial, helvetica, sans-serif;
padding:10px;
border: Dashed 3px;
border-color: #66CCFF;
width: 300px;
height: auto;
position: static;
margin: 30px;
margin-left: 500px;
margin-top: 40px;
}
h2 {
text-align: center;
font-family: arial, helvetica, sans-serif;
padding:10px;
border: Dashed 3px;
border-color: #66FF66;
width: 300px;
height: auto;
margin: auto;
cursor: pointer;
}
img.first {
display: none;
margin: auto;
}
img.second{
display: none;
margin: auto;
}
img.third{
display: none;
margin: auto;
}
img.fourth{
display: none;
margin: auto;
}
img.fifth{
display: none;
margin: auto;
}
img.eight{
display: none;
margin: auto;
}
img.ninth{
display: none;
margin: auto;
}
img.tenth{
display: none;
margin: auto;
}
img.eleventh{
display: none;
margin: auto;
}
p {
text-align: center;
font-family: arial, helvetica, sans-serif;
font-size: 11.8pt;
visibility: hidden;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="C:\Users\Hayley\Documents\Coding\DENSI\day1.css">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<title> Day One </title>
</head>
<body>
<!--Navigation bar-->
<div id="nav-placeholder">

</div>

<script>
$(function(){
$("#nav-placeholder").load("nav1.htm")
;
});
</script>
<!-- Heading-->

<h1 class='first' align='center'><big> Day One </h1></big>

<!-- Section One-->

<div class="parent">
<h2 align='center'> Small Group </h2>
<p align='center'> My small group leader was Jen Hall. She was amazing, she saved Nik and I seats so that we were able to meet our small group and made us feel welcome. Our small group were accommodating and likeable. In our small group was Dana, Cheryl, Mary, Leslie, Alexis, Nadine, Chelsea, Kimberly, Lauren, Renee and Lakesha. </p>
<img class='first' src="C:\Users\Hayley\Documents\Coding\DENSI\IMG_0088.jpg" alt="Our Small Group 1"
height="130px"
width="200px"
border="1px"
style="float: left; margin-left: 17%; margin-bottom:0.5em; margin-top: 1em;"
/>
<img class='third' src="C:\Users\Hayley\Documents\Coding\DENSI\IMG_0090.jpg" alt="Our Small Group 2"
height="130px"
width="200px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom:0.5em; margin-top: 1em;"
/>
<img class='second' src="C:\Users\Hayley\Documents\Coding\DENSI\IMG_0089.jpg" alt="Our Small Group 3"
height="130px"
width="200px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom:0.5em; margin-top: 1em;"
/>
<p style="clear: both;"></p>
</div>

<!--Section Two-->
<div id='parent'>
<h2 align='center'> What Did We Do? </h2>
<p> We started off with an opening session. In this session there was a video introducing a new country to the group made by the attendees from that country, and there were discussions about someone people had connected with the previous day as well as the timetable for the day. In the morning we had a session let by Jaime LaForgia and then it was lunch time! <br/> I didn't realise how much I was going to like American food. Turns out it is A LOT.</p>
<img class='fourth' src="C:\Users\Hayley\Documents\Coding\DENSI\14.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<img class='fifth' src="C:\Users\Hayley\Documents\Coding\DENSI\42.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<img class='eight' src="C:\Users\Hayley\Documents\Coding\DENSI\68.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<img class='ninth' src="C:\Users\Hayley\Documents\Coding\DENSI\69.jpg"
height="200px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Food"/>
<p style="clear: both;"></p>
</div>
<!--Section 3-->
<div id='parent'>
<h2 align='center'> International Group </h2>
<p> In the afternoon we went to a different building to be part of the international group meet up. Firstly, we looked at and discussed a powerpoint led by Lance about SOS and how to improve the Discovery software and services in front of the CEO, Bill Goodwyn. While in the room we had to introduce ourselves; say our name, where we worked, discuss our school community and/or how we use Discovery software in our school. Except I didn't. I stayed quiet, sat back in my chair and took in everything everyone else was saying, listened and just did not introduce myself; because I don't enjoy big groups. Thankfully, Christine let me get away with this, saved me the embarrassment and let me stay in my comfort zone. </p>
</div>

<!--Section 4-->
<div id='parent'>
<h2 align='center'> The DEN at Night... </h2>
<p> At night, the DEN becomes a different place. It becomes less professional and more... personal and party-vibey. Alcohol is found and everyone becomes less tense, people relax, make friends, network in ways we can't during the day. During the DEN at Night I made friends with an awesome group of people, including Kelli, Heather and Kamala. These are my newest life-long friends.:)</p>
<img class='tenth' src="C:\Users\Hayley\Documents\Coding\DENSI\13.jpg"
height="150px"
width="250px"
border="1px"
style="float: left; margin-left: 30%; margin-bottom: 5em;"
alt="American Friends and I"/>
<img class='eleventh' src="C:\Users\Hayley\Documents\Coding\DENSI\72.jpg"
height="250px"
width="150px"
border="1px"
style="float: left; margin-left: 10%; margin-bottom: 5em;"
alt="American Friends and I"/>
<p style="clear: both;"></p>
</div>

<!--Footer-->
<div id="footer">

</div>

<script>
$(function(){
$("#footer").load("footer.htm")
;
});
</script>
<script>
$(".parent").children("h2").click(function(){
$(".parent").children("p").css("visibility", "hidden");
$(this).siblings("p").css("visibility", "visible");
$(".parent").children("img.first", "img.second", "img.third").css("display", "block");
$(this).siblings("img.first", "img.second", "img.third").css("display", "block");
$(".parent").children("img.fourth", "img.fifth", "img.eight", "img.ninth").css("display", "block");
$(this).siblings("img.fourth", "img.fifth", "img.eight", "img.ninth").css("display", "block");
$(".parent").children("img.fourth", "img.fifth", "img.eight", "img.ninth").css("display", "block");
$(this).siblings("img.tenth", "img.eleventh").css("display", "block");
});
</script>
</body>
</html>

关于javascript - JS 编码不能在一个以上的页面上工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45395151/

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