2011-10-18 14 views
11

Oto kod Obecnie mam:Maszynka do golenia - Jak mogę renderować różne znaczniki body na podstawie różnych warunków?

@{ 
    if (Request.Browser.Browser == "IE") { 
     if (Request.Browser.MajorVersion == 7) { <body class="ie7"> } 
     if (Request.Browser.MajorVersion == 8) { <body class="ie8"> } 
     if (Request.Browser.MajorVersion == 9) { <body class="ie9"> } 
     if (Request.Browser.MajorVersion > 9) { <body> } 
    } else { 
     <body> 
    } 
} 

Tutaj jest błąd, że zwraca gdy przeglądarka próbuje uczynić go:

Komunikat o błędzie analizatora składni: Blok kodu brakuje zamykanie " } " znaków. Upewnij się, że masz pasujący znak "}" dla wszystkich znaków "{" w tym bloku i że żaden ze znaków "}" nie jest interpretowany jako znacznik.

Co do cholery? Udało mi się to zrobić w standardowej składni szablonu ASP.NET! Oto, jak to wyglądało:

<% // Adaptation of paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ 
    if ((Request.Browser.Browser == "IE") && (Request.Browser.MajorVersion == 7)) { %><body class="ie7"><% } %> 
<% if ((Request.Browser.Browser == "IE") && (Request.Browser.MajorVersion == 8)) { %><body class="ie8"><% } %> 
<% if ((Request.Browser.Browser == "IE") && (Request.Browser.MajorVersion == 9)) { %><body class="ie9"><% } %> 
<% if ((Request.Browser.Browser == "IE") && (Request.Browser.MajorVersion > 9)) { %><body><% } %> 
<% if (Request.Browser.Browser != "IE") { %><body><% } %> 
+0

robi też to bzdura walidacji [HTML] (http://joshuahayworth.com/wp-content/uploads/2011/10/razorEngineStackOverflowQuestion01.png) w IDE, co jest denerwujące. –

+1

Dlaczego nie używasz CSS zawiera? http://css-tricks.com/132-how-to-create-an-ie-only-stylesheet/. Po prostu zdefiniuj styl "ciała" w każdym z tych skryptów. – jgauffin

+0

Sprawdź to teraz! Dzięki za link. –

Odpowiedz

24

Lepszą opcją może być zadeklarowanie zmiennej ieClass u góry widoku, a następnie odniesienie jej do znacznika body.

@{ 
    string ieClass = ""; 
    if (Request.Browser.Browser == "IE") { 
     if (Request.Browser.MajorVersion == 7) { ieClass="ie7"; } 
     else if (Request.Browser.MajorVersion == 8) { ieClass="ie8"; } 
     else if (Request.Browser.MajorVersion == 9) { ieClass="ie9"; } 
    } 
} 

...

<body class="@ieClass"> 
+0

To działa! Jednak w Firefoksie mam teraz . Nie jestem pewien, czy jestem z tego zadowolony. –

+0

Rozpocznij od ieClass jako "", a następnie w pierwszym meczu zacznij od "class =" + "ie7" na przykład tak, że jeśli ieClass == "" to ieClass = "class =", wtedy zacznij działać magią. Ale posiadanie "class =" "" jest ok, a przeglądarki nie powinny mieć żadnych problemów. –

0

Otwierasz wiele tagów <body>, ale nie zamykaj ich. Razor jest "inteligentny", więc zapamiętuje otwarte i zamknięte tagi podczas analizy.

Można powiedzieć, maszynkę do ignorowania tagów za pomocą

@:<body class="ieX"> 

jeśli uciec ostatni <body> należy również uciec tag </body> jak @:</body>. Moja rada to pozostawić jeden tag <body> bez zmian.

Ale jest coś więcej.

Twoje sformatowanie wszystkiego w jednym wierszu prawdopodobnie również myli brzytwę. Tak (nie badane) trzeba coś takiego:

if (Request.Browser.MajorVersion == 7) { <text>@:<body class="ie7"></text> } 

Jeśli to nie zadziała, format to lubią:

if (Request.Browser.MajorVersion == 7) { 
    @:<body class="ie7"> 
} 

(patrz odpowiedź JRummel za) I chyba najprostszym rozwiązaniem jest:

 @{ 
     var bodyClass = string.Empty; 

     if (Request.Browser.MajorVersion == 7) { bodyClass = "ie7"; } 
     if (Request.Browser.MajorVersion == 8) { bodyClass = "ie8"; } 
     // etc 
    } 
    <body class="@bodyClass"> 
    </body> 

2

polecam również nieco czystsze podejście poprzez umieszczenie maszynki/C# kod na górze strony i za pomocą zmiennych logicznie przypisać wartości do wykorzystania w ramach swojej stronie. Po pierwsze, rozwiązuje problem tagów, ale także pomaga w utrzymaniu kodu.

@{ 
    string bodyCssClass = string.Empty; 
    switch(Request.Browser.Browser) 
    { 
     case "IE": 
      switch(Request.Browser.MajorVersion) 
      { 
       case 7: 
        bodyCssClass = "browser-ie7"; 
        break; 
       case 8: 
        bodyCssClass = "browser-ie8"; 
        break; 
       case 9: 
        bodyCssClass = "browser-ie9"; 
        break; 
       default: 
        bodyCssClass = "browser-ie6"; 
      } 
      break; 
    } 
} 
<!DOCTYPE html> 
<html> 
<head> 
    <title>@Page.Title</title> 
</head> 
<body class="@bodyCssClass"> 
    <div>@RenderBody()</div> 
</body> 
</html> 

Ze wszystkim, co powiedzieli; chyba że nie jest dostępna dla tej strony, wykonana praca nie powinna znajdować się w elemencie prezentacji (plik cshtml), lecz w aplikacji ViewBag (np. ViewBag.BodyCssClass).

[Edytuj] Nie pamiętam przerwy dla instrukcji zewnętrznego przełącznika dla przypadku "IE". :)

+0

To też działa! Skończyłem z wykorzystaniem kombinacji twojego i kodu jrummella, aby rozwiązać mój problem. –

0

Odpowiedź JRummela jest prawidłowa. Aby go rozszerzyć, zmodyfikowałem jego skrypt, aby umożliwić mi obsługę starszych wersji IE i zachować kompatybilność wsteczną.

@{ 
Layout = null; 

string ieClass = ""; 
if (Request.Browser.Browser == "IE") 
{ 
    ieClass += " ie"; 
    if (Request.Browser.MajorVersion == 9) { ieClass += " lt-ie10"; } 
    if (Request.Browser.MajorVersion == 8) { ieClass += " lt-ie9"; } 
    if (Request.Browser.MajorVersion == 7) { ieClass = " lt-ie8"; } 
} 
} 
<!doctype html> 
<html lang="en-us" dir="ltr" class="no-js @ieClass.Trim()"> 
7
@if (Request.Browser.Browser == "IE" || Request.Browser.Browser == "InternetExplorer") 
{ 

} 
+0

Zamierzałem dodać tę odpowiedź i zobaczyłem twoją. Microsoft musiał zmienić to, co zwraca przeglądarka żądań. –

Powiązane problemy