基于所选样式表在页面之间导航时切换链接文本

Question

我已经在我的网站上安装了一个脚本，允许低对比度设置和高对比度设置，因为我的网站将被视障人士使用。这个脚本运行得很完美。唯一的问题是当访问者访问站点的多个页面时。

当您第一次访问该站点时，低对比度设置在默认情况下有效，并且只显示指向高对比度设置的链接。如果我随后访问网站的其他页面，低对比度设置在默认情况下有效，只有高对比度链接出现(这是完美的，也是应该的)。

这是问题所在。如果我单击高对比度链接查看高对比度设置的页面，然后转到另一个页面，另一个页面将以高对比度设置显示(正如它应该出现的那样)，但出现的不是指向低对比度设置的链接(我希望出现这种情况)，而是指向高对比度设置的链接(考虑到页面已经处于高对比度设置，这没有任何意义)。

为了解决这个问题，我知道如果我在每个页面的开头放一个'query string javascript‘，每个页面中的链接就会将当前的对比度设置传递到下一个页面(只要访问者使用链接移动，而不是直接在地址栏中输入)。有人知道如何创建这样的“查询字符串javascript”吗？我试着自己创建这样一个字符串，但没有成功。

我的网站还没有完成，但我在http://www.14kt.eu/上发布了几个页面，这样你就可以看到我在说什么。

谢谢你抽出时间来，克里斯

Answer 1

查看your站点上的代码，我可以看到您使用的是来自DynamicDrive.com的一些示例代码。这段代码已经使用cookie来跟踪在页面之间切换时使用哪个样式表(高对比度或“无”表示低对比度)。

您所需要做的就是添加一个javascript行来切换选择样式表的span链接的可见性。这需要在页面加载时运行。

更新：因为代码需要在每个页面中运行，所以只需更改"script_1.js“文件即可。它当前有一个在window.onload事件中运行的名为FixRows()的函数。只需在其中添加新代码，如下所示：

​

// JavaScript Document
function FixRows(){
  var oddclass = 'sld';
  var evenclass = 'sl';
  var ulID = 'listings';
  var listings = document.getElementById(ulID);
  if(listings !=null){
    var rows = listings.getElementsByTagName('li');
    var len = rows.length;
    for(var i = 0; i < len; i++){
      rows[i].className = (i%2)?oddclass:evenclass;
    }
  }

  /* new code here */
  if(getCookie("mysheet") == 'highcontrast'){
    swapFor('Hc','Lc');   
  }
  /* end new code */

};
window.onload = FixRows;