Question

好吧所以我在代码方面非常基础，但我们必须在学校为我的计算机科学课程制作一个网页，其中一个部分包括以前的课程安排。我将它简化为：我在顶部有一个导航栏，一个选项（时间表）有一个下拉菜单到几个子选项（过去几年）。如果你点击主选项，它会链接到一个页面（schedules.html）哪里有按钮。这些按钮运行一个简单的脚本，显示嵌入在按钮正下方的以前课程表的图片[到目前为止所有这些都按照我的要求工作]

我无法找到的方法是将下拉选项（过去几年）链接到日程表页面，然后运行加载后显示图片的脚本。再说一次，这可能是因为我对此真的很陌生。但这就是我所拥有的：

HTML


         <li><a href="schedules.html">Class Schedules</a>
            <ul>
               <li><a href="?">2015</a></li> 

<!--want to happen: when select a year, loads schedule page then loads the schedule for that year, -->

               <li><a href="?">2014</a></li>
               <li><a href="?">2013</a></li>
               <li><a href="?">2012</a></li>
            </ul>         
         </li>

用于显示我在简单表格中设置的时间表的按钮：

<tr> 
    <td>2015</td>
    <td><input type="button" value="Fall"onClick="pic1()"/></td>
    <td><input type="button" value="Spring"onClick="pic2()"/></td>
</tr>

图片的脚本：

<script type = "text/javascript">
    function pic1() /*fall 2015*/
    {
        document.getElementById("schedule").src = "fall15.png";
    }

    function pic2() /*spring 2015*/
    {
        document.getElementById("schedule").src ="spring15.png";
    }

等...

<img src = "" id = "schedule"/> <!--place where the image goes-->

如果已在某处回答，我道歉。我找了好几天，但我不确定我在寻找什么。我没有在这里包含CSS代码，因为我认为它不会影响答案，但如果值得的话，CSS会链接到样式表。

Answer 1

我不确定你真正想要的是什么，因为你的例子有2015年的两张图片，但如果你想将它们分开，这将有效（未经测试）。

<body onload="checkYear()">

links would be:
<a href="schedules.html?year=15&season=fall">2015 Fall</a>
<a href="schedules.html?year=15&season=spring">2015 Spring</a>

<script type="text/javascript">
function checkYear(){
    var yearVal = getParameterByName('year');
    var seasonVal = getParameterByName('season');
    if(yearVal && seasonVal){
        document.getElementById("schedule").src = (seasonVal + yearVal + '.png');
    }
}

/*http://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript*/
function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
       results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

Answer 2

其中一种方法是通过URL传递参数，然后在javascript文件中读取它们

通过类似library(data.table) df[, col1:=pmatch(Price-Price[1]>10,T, nomatch=0), cumsum(TroughPriceFlag)][ , count:=which(col1==1)-1,cumsum(TroughPriceFlag)][ TroughPriceFlag==0, count:=NA] #> df # DATETIME Price TroughPriceFlag col1 count # 1: 2014-01-01 00:00:00 23 0 0 NA # 2: 2014-01-01 00:15:00 22 1 0 5 # 3: 2014-01-01 00:30:00 23 0 0 NA # 4: 2014-01-01 00:45:00 24 0 0 NA # 5: 2014-01-01 01:00:00 27 0 0 NA # 6: 2014-01-01 01:15:00 31 0 0 NA # 7: 2014-01-01 01:30:00 33 0 1 NA # 8: 2014-01-01 01:45:00 34 0 0 NA # 9: 2014-01-01 02:00:00 31 0 0 NA #10: 2014-01-01 02:15:00 26 0 0 NA #11: 2014-01-01 02:30:00 24 0 0 NA #12: 2014-01-01 02:45:00 23 0 0 NA #13: 2014-01-01 03:00:00 19 0 0 NA #14: 2014-01-01 03:15:00 18 1 0 8 #15: 2014-01-01 03:30:00 19 0 0 NA #16: 2014-01-01 03:45:00 19 0 0 NA #17: 2014-01-01 04:00:00 23 0 0 NA #18: 2014-01-01 04:15:00 25 0 0 NA #19: 2014-01-01 04:30:00 26 0 0 NA #20: 2014-01-01 04:45:00 26 0 0 NA #21: 2014-01-01 05:00:00 27 0 0 NA #22: 2014-01-01 05:15:00 30 0 1 NA #23: 2014-01-01 05:30:00 26 0 0 NA #24: 2014-01-01 05:45:00 25 0 0 NA #25: 2014-01-01 06:00:00 24 0 0 NA的网址或您认为合适的网址传递变量，然后在您的javascript中使用year=2015]进行阅读，从而为您提供所需的参数。

然后使用if else梯形图决定将根据年份参数显示哪些图像。

在html文件中有这个

location.search.split('year=')[1

您的schedules.html文件中的

有此

<li><a href="schedules.html">Class Schedules</a>
    <ul>
        <li><a href="schedules.html?year=2015">2015</a></li> 
        <li><a href="schedules.html?year=2014">2014</a></li>
        <li><a href="schedules.html?year=2013">2013</a></li>
        <li><a href="schedules.html?year=2012">2012</a></li>
    </ul>         
</li>

credit

使用一个页面中的链接链接到另一个页面中的不同脚本

2 个答案: