4

我有一个网站，用户可以在其中使用向导生成自己的 Codeigniter 网站，用户将提供模块、字段和功能详细信息。根据用户输入，将生成一个网站并将其部署在我的网站上，并在用户开始下载之前向他们展示一个演示。一切正常。

现在我计划允许用户在预览时为生成的网站选择不同的样式/主题。如何让用户在不重新加载整个页面的情况下立即看到他们的更改？

我尝试用所选样式替换生成网站上的样式表文件，然后重定向到生成网站上的另一个页面。但是使用相同的样式表文件，因为它已经被浏览器缓存。所以请给我一些选择。如果可以在不重定向用户的情况下做到这一点，那对我来说将是最好的选择。

4

4 回答 4

4

为了防止缓存问题，样式表需要有不同的名称。这是一个如何使用 jQuery 实现它的示例：http ://www.cssnewbie.com/simple-jquery-stylesheet-switcher/

演示

于 2012-07-17T12:55:17.167 回答
1

将变量传递给视图，该变量保存样式表文件名的值？至于当用户在同一页面时更改样式文件......请参阅这个问题：是否有一种简单的方法可以在不重新加载页面的情况下重新加载 css？

<?php
$data['stylesheet_name'] = 'user1';

$this->load->view('viewname', $data);

/**
 * View File
 **/

<link rel="stylesheet" type="text/css" href="/css/user/<?= $stylesheet_name; ?>.css" />
于 2012-07-17T17:12:38.650 回答
0

我使用了下面的代码，它无需更改样式表文件名即可工作。

function reloadStylesheets() {
    var queryString = '?reload=' + new Date().getTime();
    $('link[rel="stylesheet"]').each(function () {
        this.href = this.href.replace(/\?.*|$/, queryString);
    });
}

这会强制浏览器重新加载文件，因为参数因时间更改而更改。

于 2012-07-18T05:36:55.503 回答
0

这对我来说可以替换单个样式表。样式表命名为“themegray”、“themeblue”、“themegreen”等。“t”代表新颜色，例如“blue”。

function flipTheme(t) {
    $('link[rel="stylesheet"]').each(function () {
        if (this.href.indexOf(theme)>=0) {
            this.href = this.href.replace(theme, t);
            theme = t;
        }
    });
}
于 2015-11-09T22:07:31.060 回答