javascript dont work with jquery in the same page

Question

I am having a problem with my code, which is a mix of jquery and plain javascript. I use jquery to show and hide some divs and the js to refresh a div by loading a page inside the div. The plain js code doesn't work as is, but if I delete the jquery code it works fine.

My code :

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ton plans</title>
<link href="template/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
    $('#refresh').fadeOut().load('last_post.php').fadeIn();
}, 10000); 
</script>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>

<script type="text/javascript">

  //no conflict jquery
  jQuery.noConflict();
  //jquery stuff
  (function($) {
      $(document).ready(function()
      {  


         $("#bott_div").click(function() {
         $("#div_profile").show(['fast'])

         })

         $("#page").click(function() {
         $("#div_profile").hide(['fast'])

         })


      })  
 })    
          (jQuery);

</script>

</head>

There is a conflict between the jQuery code and the plain javaScript that is preventing it from working properly. I would require help identifying the problem.

the question isn't clear, what exactly does "javascript doesn't work with jQuery" even mean? since jquery is a javascript lib — alonisser, Feb 12 '13 at 19:32
( var auto_refresh .... ) not work but if i delete ( (function($) { $(document).ready(function() { ...... ) work fine — Schyzo Phrény, Feb 12 '13 at 19:47

score 3 · Answer 1 · answered Feb 12 '13 at 19:29

3

Change the order of the first two scripts -- like this

<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
    $('#refresh').fadeOut().load('last_post.php').fadeIn();
}, 10000); 
</script>

answered Feb 12 '13 at 19:29

Hogan

69,564
10
76
117

nothing the js code not work . ( auto_refresh ) but if i delete the jqury code the show and hide . js code work fine – Schyzo Phrény Feb 12 '13 at 19:41
@SchyzoPhrény - then you must already be including jQuery -- is this part of another service that is already including it (eg typepad)? – Hogan Feb 12 '13 at 21:02

score -1 · Answer 2 · answered Feb 12 '13 at 19:31

-1

There is a "(" in front of your function in jQuery code. Encapsulate code in a

     $(document).ready(function() {
        $("sampleSelect").click(function() {
        //code
        }
     });

answered Feb 12 '13 at 19:31

tymeJV

103,943
14
161
157

not always: http://stackoverflow.com/questions/11403266/understanding-vs-jquery-in-iife-instead-of – djb Feb 12 '13 at 19:32
1

That is how it is supposed to be... it is (....)(jQuery); -- call that code with jQuery as a parameter. – Hogan Feb 12 '13 at 19:37

javascript dont work with jquery in the same page

2 Answers2