CODEWITHSUNDEEP
internet-explorerjquery-mobilecompatibility
laurent
laurent

Reputation: 90776

jQuery Mobile not working with Internet Explorer?

I'm trying to make my jQuery Mobile work with Internet Explorer.

My code is rather simple, it's just a small form.

I put a demo there: http://pogopixels.com/jqmtest.html

<!doctype html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
    <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
</head>
<body>
<div data-role="page">

    <div data-role="content">
        <form action="http://mxc.local/api/signup" method="post" accept-charset="utf-8">
            <div data-role="fieldcontain">
                <label for="email">Email</label><input type="text" id="email" name="email" />
            </div>
            <div data-role="fieldcontain">
                <label for="username">Username</label><input type="text" id="username" name="username" />
            </div>
            <div data-role="fieldcontain">
                <label for="password">Password</label><input type="password" id="password" name="password" />
            </div>
            <div data-role="fieldcontain">
                <label for="confirmPassword">Confirm</label><input type="password" id="confirmPassword" name="confirmPassword" />
            </div>
            <button name="submit">Sign Up</button>
        </form>
    </div> <!-- /content -->

</div>
<!-- /page -->
</body>
</html>

It works in Firefox and Chrome, however IE9 displays a blank page.

IE displays a message like "A problem displaying localhost made IE to switch to compatibility mode" at the bottom.

Any idea what I could do to make it work?

Upvotes: 2

Views: 8758

Answers (3)

user3568918
user3568918

Reputation: 43

Had the same Problem (with JQM and ASP.NET PROJECT). Binding the scripts localy, did the job for me.

like..

<script src="jquery.mobile-1.4.2/jquery.mobile-1.4.2.min.js"></script>

as often recommended:

<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>

Dont forget to keep the right binding Order:

  1. jquery mobile css
  2. jquery script
  3. jquery mobile script

Upvotes: 1

mayo
mayo

Reputation: 41

I know this post is a year old, but for posterity, if you have this problem check your javascript for console.log statements and remove them or do this log.console thread

Upvotes: 1

laurent
laurent

Reputation: 90776

I got my answer in another question - Mobilejquery show nothing on Internet explorer

We stopped testing jQuery mobile on IE since lots of stuff doesn't work, if it works fine on all the phones and Chrome/FF why bother I guess - it's intended for the phone and you can for the most part develop in Chrome – Clay Liu Feb 8 at 17:17

A pity as, for me, no support for IE is a deal breaker (even if indeed the framework is intended for mobile phones).

Upvotes: 6

Related Questions