似乎我的部署版本的jQuery Mobile网站存在问题。在本地机器上运行,看起来没问题。为什么IE11有奇怪的行为?
但是,当部署到测试服务器时,jQuery Mobile的UI会遇到问题(如下图所示)。我已经在IE11和Chrome上测试了部署的网页。在Chrome上,它看起来与本地托管版本完全相同,所以它在IE11上只是“奇怪的”iu。
的HTML源当然是相同的两个版本,节选的路径文件(CSS/JS),但同样在Chrome它适用于两个“版本”。
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="viewport" content="width=device-width" initial-scale="1" />
<!-- Styles -->
<link href="/Content/Site.css" rel="stylesheet" type="text/css"/>
<link href="/Content/jquery.mobile-1.4.2.css" rel="stylesheet" type="text/css"/>
<link href="/Content/jquery.mobile.datepicker.css" rel="stylesheet" type="text/css"/>
<!-- Scripts -->
<script src="/Scripts/Bundles/jquery?v=_evuqQpQzfiv74i_e2xne0q8qDFolKEd-XnaMgC-rWw1"></script>
<script src="/Scripts/jquery.ui.datepicker-nb-NO.js"></script>
<script src="/Scripts/Bundles/jqueryMobile?v=sCRDQK2ukYmfF8e6gB7crpqBhGj3REAZ0OWnxCy4ozU1"></script>
</head>
<body>
<div data-role="page" data-theme="a">
<div data-role="header" data-theme="a">
<a href="/" data-icon="home" data-iconpos="notext">Home</a>
<h1></h1>
</div>
<div data-role="content">
<a href='#' data-role="button"><div><div class="btn-icon-text">Button 1</div></div></a>
<a href='#' data-role="button"><div><div class="btn-icon-text">Button 2</div></div></a>
</div>
<div data-role="footer" data-position="fixed" data-theme="a">
<div id="leftBottomContent" style="float: left"><a href="#" data-rel="back" class="ui-btn">back</a></div>
<div id="rightBottomContent" style="float: right"></div>
<div id="centerBottomContent" style="margin-left: auto; margin-right: auto; text-align: center; margin-top: 15px;"></div>
</div>
</div>
</body>
</html>
我已经使用Fiddler检查过来自服务器的请求是否正常。任何人都可以通过一个方向来指出这一点吗?
尝试在'/ Scripts'和'/ Content'之前删除'/'。似乎错误的路径。并检查控制台说什么。如果您的路径错误,您可能会收到错误消息。 – 2014-09-11 08:36:24
该路径由ASP.NET - > href =“@ Url.Content(”〜/ Content/jquery.mobile-1.4.2.css“)生成,如果我使用Chrome(查看源代码)检查路径,它们是找到。但在Chrome中,它的工作非常完美。 – Kman 2014-09-11 08:59:58
本地部署也可能意味着兼容性视图的问题,您可以检查IE11内的开发人员中心,以确保没有选择兼容模式? – Icepickle 2014-10-06 09:55:09