jQuery Mobile is not working on godaddy server

267 Views Asked by At

Jquery Mobile library is not working on my host. I've also tried linking it through CDN but i get more errors.

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/jqmobile.css">
    <script type="text/javascript" src="js/jqmobile.js"></script>
    <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
    <div data-role='page' id='first-page'>
        first page
    </div>
    <div data-role='page' id='second-page'>
        second page
    </div>
</body>
</html>

Output i get from this code is:

first page
second page

and the error i'm getting from the console is:

Cannot set property 'mobile' of undefined

browse.php?u=http%3A%2F%2Fpickfour.com%2Fjs%2Fjqmobile.js&b=4:5Uncaught TypeError:

it looks like the error happens on this line somewhere in my jqmobile.js file.

{!function(a){a.mobile={}}(a),function(a,b){function d(b,c){var d,f,g,h=b.nodeName.toLowerCase();return"area"===h?(d=b.parentNode,f=d.name,b.href&&f&&"map"===d.nodeName.toLowerCa

I've called my hosting providers support but it didn't help, i've been on this for a day now. Any help is appreciated.

1

There are 1 best solutions below

0
steve On

Its unlikely that your problem has anything to do with Go Daddy as a hosting provider.

On a first inspection of your code, what stands out is that you are calling jQuery mobile before you are calling jquery. Since jQuery mobile has a dependency on jQuery I suspect this is your problem.

If you take look at the jQuery mobile docs quick start guide you can see this is illustrated:

<head> 
<title>My Page</title> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head> 

I suspect fixing this will sort your problem.