javascript jquery mobile 和 Internet Explorer 根本不工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7226467/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery mobile and Internet Explorer are not working at all
提问by rajh2504
I know that IE 7-9 are Grade A supported. But with my site it is not working, I can't figure out for the life of me why. Here is the link: http://www.fuelingminds.com/userpages.cfmI've done previous projects using alpha 4 and everything looked just fine, but I switched to beta 1 now. are there any known issues that are out there or am I just missing something obvious in my code?
我知道 IE 7-9 支持 A 级。但是我的网站无法正常工作，我一生都无法弄清楚为什么。这是链接：http: //www.fuelingminds.com/userpages.cfm我以前使用 alpha 4 完成过项目，一切看起来都很好，但我现在切换到 beta 1。是否有任何已知问题，或者我只是在我的代码中遗漏了一些明显的问题？
Note: I tried disabling ajax to see if that was the cause, but still the same skewed look, I've tried on IE 7 and 9 on multiple computers, tried using jquery mobile from a local source instead as well.
注意：我尝试禁用 ajax 以查看这是否是原因，但仍然是相同的倾斜外观，我在多台计算机上尝试过 IE 7 和 9，也尝试使用来自本地源的 jquery mobile。
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
<link href="css/loginandError.css" type="text/css" />
</head>
<body>
<div data-role="page" data-theme="c" id="login" data-ajax="false">
<div data-role="header">
<a onClick="window.history.back()" data-icon="back" data-direction="reverse" >back</a>
<a href="index.cfm">home</a>
<h1>Fueling The Future - Login</h1>
</div>
<div data-role="content" align="center">
<form action="loginAct.cfm" method="post" data-ajax="false">
<input type="text" value="[email protected]" name="email">
<input type="password" value="password" name="pass">
<br>
<input type="submit" value="login" name="login" data-inline="true">
<br>
<a href="" style="text-decoration:none;">Register To Apply Today!</a>
</form>
</div>
</div>
<!--- <div data-role="page" data-theme="c" id="register" data-ajax="false">
<div data-role="header">
<h1>Fueling The Future</h1>
<!--<div data-role="navbar">
<ul data-inset="true" style="margin-top: 0px; margin-bottom: 0px;">
<li><a href="">Home</a></li>
<li><a href="">The Program</a></li>
<li><a href="">Page 3</a></li>
<li><a href="">Page 4</a></li>
<li><a href="">Contact</a></li>
</ul>
</div>-->
</div>
<div data-role="content">
<cfform action="regAction.cfm" method="post" data-ajax="false">
<label for="email">E-mail</label>
<cfinput type="text" label="E-mail" name="email" >
<label for="pass">password</label>
<cfinput type="password" name="pass" >
<label for="passChk">enter password again</label>
<cfinput type="password" name="passChk" >
<label for="fName">First Name</label>
<cfinput type="text" name="fName">
<label for="lName">Last Name</label>
<cfinput type="text" name="lName">
<br>
<cfinput type="submit" name="submit" value="register" data-inline="true">
</cfform>
</div>
<div data-role="footer">
</div>
</div>--->
</body>
</html>
回答by Anthony James
You need to have <!DOCTYPE html>or else it wont read the html5 correctly.
你需要有<!DOCTYPE html>，否则它不会正确读取 html5。
回答by Wudzik
<meta charset="utf-8" http-equiv="X-UA-Compatible" content="IE=9" />
<!--[if IE 7]><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /><![endif]-->
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<style type="text/css">
.clear {
zoom: 1;
display: none;
}
</style>
<![endif]-->
paste this to your layout page
将此粘贴到您的布局页面
回答by TIM
Is this pageworking with your IE9?
此页面是否适用于您的 IE9？
If yes, it is unfortunately Alpha3 of jQuery Mobile, but perhaps these fixes will work for you:
如果是的话，不幸的是 jQuery Mobile 的 Alpha3，但也许这些修复对你有用：
// Fix for IE9 and experimental jQuery Mobile Datepicker
//customize jQuery Mobile to let IE7+ in (Mobile IE)
$(document).bind("mobileinit", function(){
//reset type=date inputs to text
$.mobile.page.prototype.options.degradeInputs.date = true;
$.extend($.mobile, {
//extend gradeA qualifier to include IE7+
gradeA: function() {
//IE version check by James Padolsey, modified by jdalton - from http://gist.github.com/527683
var ie = (function() {
var v = 3, div = document.createElement('div'), a = div.all || [];
while (div.innerHTML = '<!--[if gt IE '+(++v)+']><br><![endif]-->', a[0]);
return v > 4 ? v : !v;
}());
//must either support media queries or be IE7+
return $.support.mediaquery || (ie && ie >= 7);
}
});
});
You have to put these lines of code between query.js and query.mobile.js.
您必须将这些代码行放在 query.js 和 query.mobile.js 之间。
