Same java console errors even after rectification

Question

The following code worked flawlessly when added to master code which doesn't contain any jquery script.

<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.js"></script>
<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.flexslider-min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $(window).load(function() {
        $('.flexslider').flexslider({
            animation: "fade",
            animationLoop: true,

        });
    });
});
</script>

But when added to a template which already has jquery element, it gave following two errors in java console.

1.TypeError: $ is not a function

2.Use of getPreventDefault() is deprecated. Use defaultPrevented instead.

Then I modified the code using '$.noConflict();' as:

<script type="text/javascript" src="http://project.dimpost.com/flexslider-carousel/jquery.js"></script>
<script type="text/javascript">
$.noConflict();
jQuery(document).ready(function($) {
    jQuery(window).load(function($) {
        jQuery('.flexslider').flexslider({
            animation: "fade",
            animationLoop: true,

        });
    });
});
</script>

This again workes flawlessly when added to master code which doesn't contain any jquery script. But when added to the one having already running a jquery, it again shos the same two errors as described above:

1.TypeError: $ is not a function

2.Use of getPreventDefault() is deprecated. Use defaultPrevented instead.

What is the workaround?

You mean _JavaScript_, not Java. Please note that, though similarly named, they are two unrelated languages. — Alexander Nied, Feb 22 '17 at 05:03

score 0 · Answer 1 · answered Feb 22 '17 at 04:45

0

i don't know accurately but it may work.., if you are using any other script like ajax,Etc it will conflict..., add like this

 var jq = $.noConflict();   
   jq(document).ready(function() {
    jq(window).load(function() {
        jq('.flexslider').flexslider({
            animation: "fade",
            animationLoop: true,

        });
    });
});

answered Feb 22 '17 at 04:45

Tried but without any result. – Chetan Feb 22 '17 at 06:17
you should not use $ inside like .ready(function($) or .load(function($) if you gave jq instad of $....pls check – Feb 22 '17 at 06:24

score 0 · Answer 2 · edited May 23 '17 at 12:24

thanks for the suuport given by you all but congratulate me first (!), the problem is solved. I followed the following steps and the code has started running-

I shifted from https to http (less seure platform, can't help)
Cancelling one of the two jquery libraries, keepping the latest version
and obviously, all that follows here Multiple scripts given here, I tested them all, many do work. :)

Same java console errors even after rectification

2 Answers2