Переключение файла CSS с помощью JQuery в приложении ASP.Net MVC - PullRequest
Новая
       2

Переключение файла CSS с помощью JQuery в приложении ASP.Net MVC

0 голосов
/ 03 февраля 2011

Я хочу переключить CSS, который применяется к моему приложению MVC. Я хочу сделать это на моей странице индекса. Определение для CSS по умолчанию находится в site.master, определенном следующим образом: 

<head runat="server">
<title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />

JQuery, который я пытаюсь использовать, который может или не может быть правильным, 

 $(document).ready(function() { 
        $("link").attr("href", '../../Content/nick.css');

    });
});

Я хочу как-то поместить этот jquery на страницу индекса (это базовое представление индекса, которое загружается с MVC) 

>   <%@ Page Language="C#"
> MasterPageFile="~/Views/Shared/Site.Master"
> Inherits="System.Web.Mvc.ViewPage" %>
> 
> <asp:Content ID="Content1"
> ContentPlaceHolderID="TitleContent"
> runat="server">
>     Home Page
>     </asp:Content>
>     <asp:Content ID="Content2" ContentPlaceHolderID="MainContent"
> runat="server">
>         <h2><%: ViewData["Message"] %></h2>
>         <p>
>             To learn more about ASP.NET MVC visit <a
> href="http://asp.net/mvc"
> title="ASP.NET MVC
> Website">http://asp.net/mvc</a>.
>         </p>
>     </asp:Content>

Может кто-нибудь взглянуть на мою jquery и посмотреть, правильно ли это, и показать, как я могу это подключить? Заранее спасибо

Ответы [ 2 ]

2 голосов
/ 03 февраля 2011

Почему бы просто не добавить / изменить ваши стили, используя дополнительный файл CSS в самом представлении.Если у вас еще нет заполнителя HeaderContent, просто добавьте его в файл Site.master, а затем добавьте в него новый CSS-код в представлении, которое вы хотите обновить. 

<head>
<title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeaderContent" runat="server" />
</head>

Тогда, по вашему мнению 

 <asp:Content ID="headerContent" ContentPlaceHolderID="HeaderContent" runat="server">
 <link href="../../Content/nick.css" rel="stylesheet" type="text/css" />
 </asp:Content>
1 голос
/ 03 февраля 2011

Я считаю, что ваш jQuery должен быть изменен на: 

$(function() {
    $('link').first().attr('href', 'nick.css');
});

Предполагая, что это первый файл CSS, который вы хотите изменить.Нет ничего плохого в использовании свойства ID для тега link: 

<link id="style" href="../../Content/Site.css" rel="stylesheet" type"text/css" />

И тогда ваш jQuery может быть: 

$('link#style').attr('href', 'nick.css');

Вы можете поместить jQuery в любое место ввашей индексной страницы, если вы оберните ее в тег <script>, но я рекомендую вам добавить ContentPlaceHolder в тег <head> вашей главной страницы: 

<head>
    <title><asp:ContentPlaceHolder ID="TitleHolder" runat="server"></title>
    <asp:ContentPlaceHolder ID="ScriptContent" runat="server" />
</head>

Затем на странице индекса добавьте для нее раздел: 

<asp:Content ContentPlaceHolderID="ScriptContent" runat="server">
    <script>
        $(function() {
            $('link#style').attr('href', 'nick.css');
        });
    </script>
</asp:Content>

Добавление данных модели в jQuery

Это почти то же самое, что вы делаете в HTML: 

<script>
    $(function() {
        $('link#style').attr('href', <%= Model.CssStyle %>);
    });

Предполагается, что ваша модель имеет свойство CssStyle.При компиляции программы вы можете получать предупреждения о недопустимых тегах Javascript, но вы можете спокойно их игнорировать.Поддержка Javascript в Visual Studio не так уж хороша без плагинов.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...