JQuery not working correctly, possible conflicts with Prototype?

I'm sorry for the vague title.

I am creating a new theme for my website and I have both jQuery tabs and a slider on the page.

Both tabs and slider are not working, although I'm not sure why. I inherited the design and just changed the theme - I think it might have something to do with a couple of jQuery scripts that are being loaded - the slider throws an error that the method .split()

doesn't exist and the tabs just don't work as they should.

+3


source to share


3 answers


You must do this:

<action method="addJs"><script>jquery/jquery.js</script></action>
<action method="addJs"><script>jquery/jquery.plugin.js</script></action>
<action method="addJs"><script>jquery/jquery.moreplugin.js</script></action>
<action method="addJs"><script>jquery/jquery.noConflict.js</script></action>

<action method="addJs"><script>prototype/prototype.js</script></action>

      

in the page.xml layout.



Jquery.noConflict.js file:

var jQuery = $.noConflict();

      

After that, you can call the jQuery () function wherever you want. Order: jquery -> jquery plugin -> jquery no conflict -> prototype

+2


source


Blasting pills are correct - you have to use jQuery.noConflict. Import jQuery first, before importing Prototype, insert the line

<script type="text/javascript">
    jQuery.noConflict();
</script>

      



If you do this, everywhere in your application where you reference jQuery, do jQuery(...)

either jQuery.

instead of $(...)

or $.

. This shouldn't mess up your import script, unless those scripts you are importing are poorly written and don't define $ for themselves.

+2


source


I prefer to use the following snippets:

<script type="text/javascript">
  jQuery.noConflict();
  (function($) {
    $.ajax(...);
  })(jQuery);
</script>

      

which will not conflict with Prototype and will use '$' for jQuery. Here's some more information: http://www.magentogarden.com/blog/using-jquery-in-magento-with-good-programming-practice.html

0


source







All Articles