0

I'm a noob in hybrid development and I'm trying to use jQuery in my App.

I'm surprised that the my code is working fine in the browser, but not in an android emulator and I don't quite understand the reason for that.

Here is my code:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Security-Policy">
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
<link rel="stylesheet" type="text/css" href="css/onsenui.css">
<link rel="stylesheet" type="text/css" href="css/onsen-css-  
  components.css">
<link rel="stylesheet" type="text/css" href="css/sliding_menu.css">
<link rel="stylesheet" type="text/css" href="css/index.css"> 
<script type="text/javascript" src="js/jquery/dist/jquery.min.js"> 
</script>  
<script type="text/javascript" src="js/angular/angular.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/onsenui.min.js"></script>
<script type="text/javascript" src="js/angular-onsenui.min.js"></script>
<script type="text/javascript" src="cordova.js"></script>   

</head>
<script>
   $(document).ready(function(){
      $("h6").click(function(){
       $(this).hide();
     });
   });
</script> 
<body>

<h6>If you click on me, I will disappear.</h6>
<h6>Click me away!</h6>
<h6>Click me too!</h6>

</body>
</html> 

Logs Output :

enter image description here

Cant understand what may be the reason...

9
  • please use android studio and debug your app it might show you errors android app is facing
    – Atul Nar
    Apr 29, 2016 at 7:29
  • @AtulNar there is no error I have seen the error log Apr 29, 2016 at 7:37
  • @AshishShukla can you place some alert in document ready function and see whether jquery document ready is fired properly in device?
    – Gandhi
    Apr 29, 2016 at 7:58
  • @AshishShukla where are you checking error logs ? can you post console logs from logcat !
    – Atul Nar
    Apr 29, 2016 at 7:59
  • @AtulNar I have added the logs Apr 29, 2016 at 8:36

2 Answers 2

0

Please try removing all the js and set only jQuery js may be they were conflicted But it is working fine with your browser so here is a jsFiddle Demo, check and compare

<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<body>
 <h6>If you click on me, I will disappear.</h6>
 <h6>Click me away!</h6>
 <h6>Click me too!</h6>
</body>

<script>
$(document).ready(function(){
  $("h6").click(function(){
   $(this).hide();
 });
});
</script>
2
  • I have removed all files except jquery js but still same Apr 29, 2016 at 8:46
  • Set alerts after document ready and then h6 on click and check if which alerts displays Apr 29, 2016 at 8:50
0

Use chrome://inspect/#devices and open the inspector for your APP.

Then find if the jquery.min.js file exists in Sources,

Type $("h6").hide(); in console and execute it, check does it work or is there any error in console?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.