0

私は非常に奇妙な問題を抱えています。ビューを Webforms ビュー エンジンから Razor に移行しました。ページの html がレンダリングされると、DOCTYPE が上部にレンダリングされず (そうあるべきです)、DOCTYPE タグの前にいくつかの JavaScript スクリプト ブロックがレンダリングされることがわかりました。何が原因なのかわかりません。その結果、ブラウザーはページを Quirks モードで表示します。これは、body タグに設定された font-size に準拠していないテーブルの font-size によって明らかになります。

また、Telerik MVC 拡張機能のバージョン 2011Q1 を使用していることにも言及する必要があります。

以下は、html ページの先頭から head タグの末尾までのページ ソースの一部です。なぜこれが起こっているのかについての助けをいただければ幸いです。

    <script type="text/javascript" src="/asset.axd?id=PQEAAB-LCAAAAAAABADsvQdgHEmWJSYvbcp7f0r1StfgdKEIgGATJNiQQBDswYjN5pLsHWlHIymrKoHKZVZlXWYWQMztnbz33nvvvffee--997o7nU4n99__P1xmZAFs9s5K2smeIYCqyB8_fnwfPyJ-8Uezjx597xd_tPro0Uevp3WxapuPRh-d82dL-uynf9E6r6-3d8f3x7vjn8Z31UePdn7JSL5t8zKvi7fjabVYVEv7_W73-zZ_106qd7bBXrfBRV3M7Lf3zLfS-fgyK4tZ1ua2wX709XxWtMXywra638MimzQtDdG2-PSXfP-XfH_00bTlRu_auz-dXWYNU4EaXNKnezu7uzTwe7v36YMpkerep_fpl48etfU6_yX_TwAAAP__IQbpFT0BAAA%3d"></script>
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function(){
if (!jQuery.telerik) jQuery.telerik = {};
jQuery.telerik.cultureInfo={"shortDate":"dd/MM/yyyy","longDate":"dd MMMM yyyy","longTime":"HH:mm:ss","shortTime":"HH:mm","fullDateTime":"dd MMMM yyyy HH:mm:ss","sortableDateTime":"yyyy\u0027-\u0027MM\u0027-\u0027dd\u0027T\u0027HH\u0027:\u0027mm\u0027:\u0027ss","universalSortableDateTime":"yyyy\u0027-\u0027MM\u0027-\u0027dd HH\u0027:\u0027mm\u0027:\u0027ss\u0027Z\u0027","generalDateShortTime":"dd/MM/yyyy HH:mm","generalDateTime":"dd/MM/yyyy HH:mm:ss","monthDay":"dd MMMM","monthYear":"MMMM yyyy","days":["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],"abbrDays":["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],"abbrMonths":["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec",""],"months":["January","February","March","April","May","June","July","August","September","October","November","December",""],"am":"AM","pm":"PM","dateSeparator":"/","timeSeparator":":","firstDayOfWeek":1,"currencydecimaldigits":2,"currencydecimalseparator":".","currencygroupseparator":",","currencygroupsize":3,"currencynegative":1,"currencypositive":0,"currencysymbol":"£","numericdecimaldigits":2,"numericdecimalseparator":".","numericgroupseparator":",","numericgroupsize":3,"numericnegative":1,"percentdecimaldigits":2,"percentdecimalseparator":".","percentgroupseparator":",","percentgroupsize":3,"percentnegative":0,"percentpositive":0,"percentsymbol":"%"};
jQuery('#CoursesGrid').tGrid({columns:[{"title":"Id","member":"Id","type":"Number","editor":null},{"title":"Course Title:","member":"Title","type":"String","editor":null},{"title":"Completion Category","member":"CompletionCategory","type":"String","editor":null},{"title":"Expiry Months (0 to 100):","member":"ExpiryMonths","type":"Number","editor":null},{"title":"Commands","commands":[{"name":"edit","buttonType":"Image"},{"name":"delete","buttonType":"Image"}]}], plugins:["editing"], editing:{"mode":"InForm","editor":"\r\n\r\n\u003cdiv\u003e\r\n    \u003cfieldset class=\"editfieldset\"\u003e\r\n        \u003clegend class=\"titlelegend\"\u003eCourse Details\u003c/legend\u003e\r\n        \u003col\u003e\r\n            \u003cli\u003e\r\n                \u003clabel for=\"Title\"\u003eCourse Title:\u003c/label\u003e \r\n                \u003cinput id=\"Title\" name=\"Title\" type=\"text\" value=\"\" /\u003e \r\n                \u003cspan class=\"field-validation-valid\" id=\"Title_validationMessage\"\u003e\u003c/span\u003e \r\n            \u003c/li\u003e\r\n            \u003cli\u003e\r\n                \u003clabel for=\"Description\"\u003eDescription:\u003c/label\u003e \r\n                \u003ctextarea cols=\"20\" id=\"Description\" name=\"Description\" rows=\"2\"\u003e\r\n\u003c/textarea\u003e \r\n                \u003cspan class=\"field-validation-valid\" id=\"Description_validationMessage\"\u003e\u003c/span\u003e \r\n            \u003c/li\u003e\r\n            \u003cli\u003e\r\n                \u003clabel for=\"ExpiryMonths\"\u003eExpiry Months (0 to 100):\u003c/label\u003e \r\n                \u003cdiv class=\"t-widget t-numerictextbox\"\u003e\u003cinput class=\"t-input\" id=\"ExpiryMonths\" name=\"ExpiryMonths\" style=\"width:100%\" value=\"0\" /\u003e\u003ca class=\"t-link t-icon t-arrow-up\" href=\"#\" tabindex=\"-1\" title=\"Increase value\"\u003eIncrement\u003c/a\u003e\u003ca class=\"t-link t-icon t-arrow-down\" href=\"#\" tabindex=\"-1\" title=\"Decrease value\"\u003eDecrement\u003c/a\u003e\u003c/div\u003e\u003cscript type=\"text/javascript\"\u003e\r\n\tjQuery(\u0027#ExpiryMonths\u0027).tTextBox({val:0, step:1, minValue:-2147483648, maxValue:2147483647, digits:0, groupSize:3, negative:1, text:\u0027Enter value\u0027, type:\u0027numeric\u0027});\r\n\u003c/script\u003e\r\n \r\n                \u003cspan class=\"field-validation-valid\" id=\"ExpiryMonths_validationMessage\"\u003e\u003c/span\u003e \r\n            \u003c/li\u003e\r\n        \u003c/ol\u003e\r\n    \u003c/fieldset\u003e\r\n\u003c/div\u003e\r\n","defaultDataItem":{"Id":0,"Title":null,"Description":null,"CompletionCategory":null,"ReminderId":0,"ExpiryMonths":0,"Deleted":false,"ScheduledCourses":[]}}, dataKeys:{"Id":"id"}, validationMetadata:{"Fields":[{"FieldName":"Title","ReplaceValidationMessageContents":true,"ValidationMessageId":"Title_validationMessage","ValidationRules":[{"ErrorMessage":"Course Title is required.","ValidationParameters":{},"ValidationType":"required"}]},{"FieldName":"Description","ReplaceValidationMessageContents":true,"ValidationMessageId":"Description_validationMessage","ValidationRules":[]},{"FieldName":"ExpiryMonths","ReplaceValidationMessageContents":true,"ValidationMessageId":"ExpiryMonths_validationMessage","ValidationRules":[{"ErrorMessage":"The Expiry Months (0 to 100): field is required.","ValidationParameters":{},"ValidationType":"required"},{"ErrorMessage":"The field Expiry Months (0 to 100): must be a number.","ValidationParameters":{},"ValidationType":"number"}]}],"FormId":"CoursesGridform"}, pageSize:0, sortMode:'single', ajax:{"selectUrl":"/Course/_IndexAjax","insertUrl":"/Course/_InsertAjax","updateUrl":"/Course/_UpdateAjax","deleteUrl":"/Course/_DeleteAjax"}, localization:{"addNew":"Add new record","delete":"Delete","cancel":"Cancel","update":"Update","insert":"Insert","edit":"Edit","select":"Select","page":"Page ","displayingItems":"Displaying items {0} - {1} of {2}","pageOf":"of {0}","filter":"Filter","filterAnd":"And","filterClear":"Clear Filter","filterDateEq":"Is equal to","filterDateGe":"Is after or equal to","filterDateGt":"Is after","filterDateLe":"Is before or equal to","filterDateLt":"Is before","filterDateNe":"Is not equal to","filterNumberEq":"Is equal to","filterNumberGe":"Is greater than or equal to","filterNumberGt":"Is greater than","filterNumberLe":"Is less than or equal to","filterNumberLt":"Is less than","filterNumberNe":"Is not equal to","filterShowRows":"Show rows with value that","filterStringEndsWith":"Ends with","filterStringEq":"Is equal to","filterStringNe":"Is not equal to","filterStringStartsWith":"Starts with","filterStringSubstringOf":"Contains","groupHint":"Drag a column header and drop it here to group by that column","filterEnumEq":"Is equal to","filterEnumNe":"Is not equal to","deleteConfirmation":"Are you sure you want to delete this record?","filterSelectValue":"-Select value-","filterBoolIsFalse":"is false","filterBoolIsTrue":"is true","noRecords":"No records to display.","cancelChanges":"Cancel changes","saveChanges":"Save changes","refresh":"Refresh","sortedAsc":"sorted ascending","sortedDesc":"sorted descending","unGroup":"ungroup"}, noRecordsTemplate:'No records to display.'});
jQuery('#TabStrip').tTabStrip();});
//]]>
</script>


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
    <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
    <title>Vigilaris Solutions</title>
    <link rel="stylesheet" href="/Content/Themes/Shared/vway-backend.css" type="text/css" />
    <link rel="stylesheet" href="/Content/Themes/Green/branding.css" type="text/css" />

    <link rel="stylesheet" href="/Content/Themes/Shared/StatusBar.css.css" type="text/css" />
    <link type="text/css" href="/asset.axd?id=lAAAAB-LCAAAAAAABADsvQdgHEmWJSYvbcp7f0r1StfgdKEIgGATJNiQQBDswYjN5pLsHWlHIymrKoHKZVZlXWYWQMztnbz33nvvvffee--997o7nU4n99__P1xmZAFs9s5K2smeIYCqyB8_fnwfPyJ-8Uezjx597xd_tPro0Ucn1bLNl-1Ho4_O-bMlfdbmZV4Xb8fTarGoluNp09DX1UePdn7JKGxwVSxn1VXzwDXZ_SXf_yXfH300bbnVu_aufHNJf-7t7O6Od8f3du_TB1PC4N6n9-mXjx619Tr_Jf9PAAAA__9JtaUdlAAAAA%3d%3d" rel="stylesheet"/>

</head>
4

3 に答える 3

4

わかった。問題を解決しました。実際、これは Telerik 関連の問題です。問題は次のとおりです。

私のレイアウト ビューでは、移行した Razor ビュー エンジン スクリプト レジストラー コードは次のようになります。

@{Html.Telerik().ScriptRegistrar()
       .Globalization(true)
       .DefaultGroup(g => g.Combined(true).Compress(true))
       .Render();
       }

これはコード ブロック アプローチであり、DOCTYPE 宣言の前のページ ソースの先頭で JavaScript スクリプト ブロックがレンダリングされるため、ブラウザが互換モード (uggglllyyy!) になります。

そこで、レイアウト ビューの Telerik コードを次のように変更しました。

@(Html.Telerik().ScriptRegistrar()
       .Globalization(true)
       .DefaultGroup(g => g.Combined(true).Compress(true))
)

スクリプト ブロックがページ ソースの最後で正しくレンダリングされるようになり、ブラウザが互換モードで動作しなくなりました。

これが他の開発者に役立つことを本当に願っています。

于 2011-03-24T14:02:56.023 に答える
0

これは、これらのスクリプトを出力ストリーム (Response.Write) に直接書き込む何かが原因で発生します。Razor は、すべてを Response にフラッシュする前に、ViewContext の Writer プロパティを出力に使用します。

于 2011-03-23T15:36:58.267 に答える
0

Telerik MVC コンポーネント、より具体的にはタブを使用していると思いますか?

ビュー テンプレート、特に _Layout.cshtml を確認し、マークアップの前にテレリック ライブラリを呼び出していないことを確認してください。

于 2011-03-23T17:04:58.250 に答える