使用JS CSS Switcher的Safari浏览器问题

Question

我一直在网站上兼职工作，逐步建立起来，包括一个CSS样式表切换器。切换器在所有浏览器中都运行良好，但是，在更新后它不再适用于Safari。

在html头中：

<link rel="stylesheet" type="text/css" href="/css/corporate.css " title="corporate">
<link rel="alternate stylesheet" type="text/css" href="/css/canvas.css " title="canvas">
<link rel="alternate stylesheet" type="text/css" href="/css/classical.css " title="classical">
<link rel="alternate stylesheet" type="text/css" href="/css/earth.css " title="earth">
<link rel="alternate stylesheet" type="text/css" href="/css/under-the-sea.css " title="under-the-sea">
<link rel="alternate stylesheet" type="text/css" href="/css/space-and-stars.css " title="space-and-stars">
<link rel="alternate stylesheet" type="text/css" href="/css/creative-one.css " title="creative-one">
<link rel="alternate stylesheet" type="text/css" href="/css/creative-two.css " title="creative-two">

<script type="text/javascript" src="/js/switcher.js"></script>

<script type="text/javascript">

        // Call stylesheet init so that all stylesheet changing functions 
        // will work.
        $.stylesheetInit();

        $(function()
    {
        // This code loops through the stylesheets when you click the link with 
        // an ID of "toggler" below.
        $('#toggler').bind(
            'click',
            function(e)
            {
                $.switcher();
                return false;
            }
        );


        // When one of the styleswitch links is clicked then switch the stylesheet to
        // the one matching the value of that links rel attribute.
        $('.styleswitch').bind(
            'click',
            function(e)
            {
                $.stylesheetSwitch(this.getAttribute('rel'));
                return false;
            }
        );
    }
);
</script>

在html中：

<div id="delightfulstyles">
<h3 id="styles">Delight In Style:</h3><div id="dsheader"></div>
<a class="styleswitch" id="ds1" rel="corporate" title="Set Corporate styling">Corporate</a><br>
<a class="styleswitch" id="ds2" rel="canvas" title="Set Canvas style">Canvas</a><br>
<a class="styleswitch" id="ds3" rel="classical" title="Set Classical styling">Classical</a><br>
<a class="styleswitch" id="ds4" rel="earth" title="Set Earth styling">Earth</a><br>
<a class="styleswitch" id="ds5" rel="under-the-sea" title="Set Under the Sea styling">Under the Sea</a><br>
<a class="styleswitch" id="ds6" rel="space-and-stars" title="Set Space and Stars styling">Space and Stars</a><br>
<a class="styleswitch" id="ds7" rel="creative-one" title="Set Creative One styling">Creative 1</a><a class="styleswitch" id="ds8" rel="creative-two" style="padding-left:2px!important;" title="Set Creative Two styling">2</a>

JS档案：

(function($)
{
    // Local vars for toggle
    var availableStylesheets = [];
    var activeStylesheetIndex = 0;

    // To loop through available stylesheets
    $.switcher = function()
    {
        activeStylesheetIndex ++;
        activeStylesheetIndex %= availableStylesheets.length;
        $.stylesheetSwitch(availableStylesheets[activeStylesheetIndex]);
    };

    // To switch to a specific named stylesheet
    $.stylesheetSwitch = function(styleName)
    {
        $('link[@rel*=style][title]').each(
            function(i) 
            {
                this.disabled = true;
                if (this.getAttribute('title') == styleName) {
                    this.disabled = false;
                    activeStylesheetIndex = i;
                }
            }
        );
        createCookie('style', styleName, 365);
    };

    // To initialise the stylesheet with it's 
    $.stylesheetInit = function()
    {
        $('link[rel*=style][title]').each(
            function(i) 
            {
                availableStylesheets.push(this.getAttribute('title'));
            }
        );
        var c = readCookie('style');
        if (c) {
            $.stylesheetSwitch(c);
        }
    };
}
)(jQuery);

// cookie functions http://www.quirksmode.org/js/cookies.html
function createCookie(name,value,days)
{
if (days)
{
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}
function readCookie(name)
{
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++)
{
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}
function eraseCookie(name)
{
createCookie(name,"",-1);
}
// /cookie functions

是否有人注意到Safari更新会导致此更改？看看这个bug，请查看Safari中的www.delightwebdesign.co.uk。

非常感谢

威廉