【问题标题】:How to change theme dynamically in mvc3如何在 mvc3 中动态更改主题
【发布时间】:2012-03-20 16:07:21
【问题描述】:

我想在用户选择时更改我的网页主题 我正在使用 MVC3。 我的想法是在 Content 文件夹中包含各种样式表,并让 _layout.cshtml 文件决定在用户​​选择时调用哪个 css 文件 目前我所能做的就是包含一个反映在所有页面上的标签 我希望视图相同,但样式表应在选择时更改。

我在 _Layout.cshtml 中尝试了这段代码:

    <script type="text/javascript">
    function loadjscssfile(filename) {
        var fileref = document.createElement("link")
        fileref.setAttribute("rel", "stylesheet")
        fileref.setAttribute("type", "text/css")
        fileref.setAttribute("href", filename)
    }
    if (typeof fileref != "undefined")
        document.getElementsByTagName("head")[0].appendChild(fileref)   

内体标签:

<select>
        <option onclick="loadjscssfile("@Url.Content("~/Content/Site1.css")")">Theme1</option>
        <option onclick="loadjscssfile("@Url.Content("~/Content/Site2.css")")">Theme2</option>
        </select>  

但这也行不通:( 请帮助我。我是 MVC3 的新手...

【问题讨论】:

    标签: css asp.net-mvc-3 model-view-controller


    【解决方案1】:

    这篇文章应该对你有所帮助:

    ASP.NET MVC Theme Supported Razor View Engine

    更新: 此示例无法使用 mvc3 进行编译。你应该为

    做一些“查找和替换”
    ViewModel.Title -> ViewBag.Title
    ViewModel.Message -> ViewBag.Message
    ViewModel.PasswordLength -> ViewBag.PasswordLength
    
    return new ViewEngineResult(CreateView(controllerContext, viewPath, masterPath), this, incompletMatch); -> return new ViewEngineResult(CreateView(controllerContext, viewPath, masterPath), this);
    

    【讨论】:

    • 嗨,我已经浏览了这个链接并下载了整个 zip 文件,但是一旦我运行它就会给我一个错误,因为:ViewModel 在当前上下文中不存在,我不知道 ViewModels
    • 如果你需要更强大的主题,你也可以试试我的 CavemanTools Mvc 工具包(nuget it)。在此处查看如何使用主题 bitbucket.org/sapiensworks/caveman-tools/wiki/Themes
    • 更新了答案。编辑后编译并在我的机器上使用 MVC3
    • @Iridio Hi 所有错误都已解决,除了一个: FindPartialView() return new ViewEngineResult(CreateView(controllerContext, viewPath, masterPath), this);
    • 如果更改返回 new ViewEngineResult(CreateView(controllerContext, viewPath, masterPath), this);在 ThemeableVirtualPathProviderViewEngine.cs 的第 96 和 125 行,它应该可以工作。至少对我有用
    【解决方案2】:

    我认为最好保留一个样式表并且只更改正文标签上的一个类

    <body class="red|blue">
        //your content
    </body>
    

    在您的样式表中,您只需为每个选择器添加不同的样式

    .red{
        background-color: red;
    }
    
    .blue{
        background-color: blue;
    }
    

    【讨论】:

    • 感谢回复但是我应该如何动态更改颜色是否应该在控制器中包含一些开关逻辑?
    猜你喜欢
    • 1970-01-01
    • 2021-01-27
    • 1970-01-01
    • 1970-01-01
    • 2019-02-22
    • 2016-12-23
    • 2019-01-31
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多