Search code examples
jquerycordovajquery-mobileatom-editorphonegap

jquery js and jquery mobile js not working

I am using phonegap with atom editor and My jquery and jquery mobile is not working. All .js file are in a folder named js and the root are properly link. I have try the online code.jquery.com version and it still doesnt work. These are the 2 version I tried:

Version 1

 `<link rel="styleheet" type="text/css" href="css/jquery.mobile-
 1.4.5.min.css">
 <link rel="styleheet" type="text/css" href="css/jquery.mobile-1.4.5.css">
 <link rel="stylesheet" type="text/css" href="css/index.css" />
 <script type="text/javascript" src="cordova.js"></script>
 <script type="text/javascript" src="js/index.js"></script>
 <script type="text/javascript"> app.initialize();</script>
 <script type="text/javascript" src="js/jquery.mobile-1.4.5.min.js">
 </script>
 <script type="text/javascript" src="js/jquery.mobile-1.4.5.js"></script>
 <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
  `

version2

 <link rel="stylesheet" 
  href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css"/>
  <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-
   1.4.5.min.js"></script>
  <script
   src="https://code.jquery.com/jquery-3.2.1.min.js"
   integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
   crossorigin="anonymous"></script>
   <link rel="stylesheet" type="text/css" href="css/index.css" />
   <script type="text/javascript" src="cordova.js"></script>
  <script type="text/javascript" src="js/index.js"></script>
   <script type="text/javascript">app.initialize();</script>

i use this code to test if my jquery is working

   `<script>
 window.onload = function(){
  if (window.jquery){
    alert("YES");
  }else {
    alert("ERROR");
  }
 }
  </script>
   `

and everytime it turn up to be error. I programmed and never turn out YES ERROR:

enter image description here

Solution

  • jQuery and jQuery mobile are not working within your project because version 1.4.5 of jQuery mobile doesn't support jQuery version 3.x.

    Try using jQuery version 2.x within your application and see if this fixes the problem. To quickly test this you can use Google's hosted jQuery just to make sure before you go downloading all the files:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

    jQuery mobile 1.5.0 was released in May this year which actually supports jQuery 3.x. Switching to the new version of jQuery mobile could also be a fix, but keep in mind that 1.5.0 is an Alpha version. You can read more about the latest version of jQuery mobile here