Стойкий коммутатор стилей с Jquery

0

Я развертываю новый стиль для веб-приложения, которое поддерживает моя компания, и хочу предоставить пользователям возможность вернуться к предыдущему стилю.

У меня переключение листов очень хорошо, но при переходе на разные страницы он возвращается к новой таблице стилей.

Я хочу, чтобы он сохранил таблицу стилей, которую пользователь решил использовать, но я не уверен, как это сделать.

Мой код:

<link rel="stylesheet" href="/Assets/css/style.css" id="style"/>
<link rel="stylesheet" href="/Assets/css/colors.css" id="colors"/>
<link rel="stylesheet" href="/Assets/css/jquery.datepicker.css" id="datepicker"/>

 <!--View Switch-->
     <div id="view">
     <button id="new" class="new">Switch to Classic View</button>
<script type="text/javascript">
    $("#new").click(function () {
        jQuery('#style').remove();
        $('head').append('<link href="/Assets/css/style.old.css" rel="stylesheet" id="oldstyle" />');
        jQuery('#colors').remove();
        $('head').append('<link href="/Assets/css/colors.old.css" rel="stylesheet" id="oldcolors" />');
        jQuery('#datepicker').remove();
        $('head').append('<link href="/Assets/css/jquery.datepicker.old.css" rel="stylesheet" id="olddatepicker" />');
    });
</script>
    <button id="old" class="old">Switch to Updated View</button>
     <script type="text/javascript">
         $("#old").click(function () {
             jQuery('#oldstyle').remove();
             $('head').append('<link href="/Assets/css/style.css" rel="stylesheet" id="style" />');
             jQuery('#oldcolors').remove();
             $('head').append('<link href="/Assets/css/colors.css" rel="stylesheet" id="colors" />');
             jQuery('#olddatepicker').remove();
             $('head').append('<link href="/Assets/css/jquery.datepicker.css" rel="stylesheet" id="datepicker" />');
         });  
</script>
</div>
<!-- End View Switch -->
Теги:
switch-statement
themes
stylesheet

1 ответ

2
Лучший ответ

Попробуйте настроить файл cookie, это лучший способ сделать это, он также позволит им покинуть сайт и вернуться с сохраненными изменениями.

setCookie ('stylesheet', 1, 60 * 60 * 24 * 365); //Sets cookie with a value of 1 valid for 1 year

var style = getCookie('stylesheet'); //Gets cookie value
document.getElementById("css").href="css" + style + ".css";
  • 0
    Можно также сохранить весь URL-адрес таблицы стилей в файле cookie, пока вы на нем. +1, если вы переписываете свой ответ так, чтобы он работал в исходном коде автора.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню