Question

我很久以前就被困住了，所以我想帮助解决我的问题。

我有2页。从第一个page A开始，我有<a href>链接到另一个页面。这是链接：

<div class="sucre" id="sucreFirst"><a href="ecole2.html"><img src="_img/slide06.jpg" width="634" height="308" alt=""/></a></div>

在另一个page B上，我有一个隐藏和显示CSS课程内容的菜单。这是菜单的代码：

 <div id="menu_G">
    <p><a href="#" onClick="document.getElementById('Titre1').className='ON';document.getElementById('Titre2').className='OFF';document.getElementById('Titre3').className='OFF'">Le mariage de 2 expériences</a></p>
    <p><a href="#" onClick="document.getElementById('Titre1').className='OFF';document.getElementById('Titre2').className='ON';document.getElementById('Titre3').className='OFF'">Né d'une conviction</a></p>
    <p><a href="#" onClick="document.getElementById('Titre1').className='OFF';document.getElementById('Titre2').className='OFF';document.getElementById('Titre3').className='ON'">Des DRH militants</a></p>
  </div>

如您所见，page B设置为首先显示titre1。

<div class="ON" id="Titre1">content</div>
<div class="OFF" id="Titre2">content</div>
<div class="OFF" id="Titre3">content</div>

当我点击来自page A i的链接时，它会将titre3类的属性更改为ON。

要继续，当我在page A的链接上查看时，我希望它显示titre3的{{1}}内容。

我尝试了很多东西，但它总是链接到page B。

感谢阅读，

阿尔弗雷德

Answer 1

嗯，你有多种方法来实现你的目标，所以我会给你一个想法和一个起点。您实际需要做的是将信息从源页面传输到目标页面，传输的信息将是要打开的元素和要关闭的元素。

在页面之间发送数据的一种简单方法是使用URL查询字符串。您只需将其添加到链接即可创建查询字符串。

将您的链接修改为：

href="ecole2.html?on=1&firstOFF=2&secondOFF=3"

?中的部分是查询字符串，其结构为：

?key=value&key=value&key=value...&key=value

现在，当使用此链接输入ecole2.html时，您将能够通过查询字符串解析器获取这3个变量（on，firstOFF和secondOFF）（you have many ways to do it）。

创建一个函数，它将获取参数并设置对它们的可见性，如：

function setVisibility(onElement, firstOffElement, secondOffElement)
{
    document.getElementById(onElement).className='ON';
    document.getElementById(firstOffElement).className='ON';
    document.getElementById(secondOffElement).className='ON';
}

当页面加载（onload事件）并且您已完成时，使用每个参数调用此函数。

<body onload="setVisibility(on, firstOff, secondOff)">

例如，on将是字符串"Titre"+onParsedVariableFromQueryString

Here is a jsdiffle具有解析URL函数和以上述相同方式定义的三个变量的实际解析。由于问题不是直接关于URL解析，我认为不需要在这里发布实际的解析方法代码。

通过上述逻辑和例子，我相信你可以靠自己的进步。

从上一页点击后切换元素类

1 个答案: