Object has no method error after no conflict - javascript

I am working on a site where I am using Scott Robbins pageslide to show/hide a responsive navigation.
For some reason the pageslide navigation works fine on the rest of the site but, when it gets to the contact page, it breaks: http://kevinpresbrey.com/contact
I took a look at the console in Chrome and I'm getting this error:
Object [object Object] has no method
I updated the jQuery call for pageside from this:
$(".open").pageslide({ direction: "right"});
To this:
jQuery(".open").pageslide({ direction: "right"});
and it's still blowing the error and causing the pageslide not to function on the contact page.
Like I mentioned before, it works fine on all the other pages, but the contact page. I have a feeling that the embedded form that was generated from constant contact might be causing the issue, but other than that, I have no idea.
Any suggestions?

You have multiple versions of jQuery in your code, which could be causing the problem (even though some of the other code seem to be working). You have v1.8.3 and v1.8.2.
One of them is being pulled from:
http://www.formstack.com/forms/js/3/jquery.min.js
the other one from:
http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js?ver=3.6
Fix that and your code should work.

Ok, I figured out what it was.
Looks like it was partially from what Hanlet said. There were two version of jQuery that were being pulled.
Apparently when I commented out the code that pulls in jQuery within my functions.php file it defaulted to the version that comes baked in with Wordpress which is version 1.10.2 and that apparently fixed the issue.
So, yeah. Hooray...I guess?

"pageslide" is not a build-in method for jquery selectors. You may want to double check if you include the "pageslide" javascript library / jquery plugin correctly.

Related

jquery conflict with hoverIntent

I have a site that has been working fine however recently we added a form to a specific page. This form was built by someone else and uses javascript/jQuery to process.
Upon adding this form it has broken most of the other jquery on the page, namely the dropdown menu plugin.
This is only happening on the below page:
http://agovo.co.uk/crm-and-sales/crm-sales/bpmonline/
The console error is:
TypeError: $(...).hoverIntent is not a function
But I noticed it has broken the slide out box to the right of the site. and these errors do not happen on other pages.
I realise there is jquery loaded twice, one if by WP and the other is manually, if i remove the manually added one it breaks everything so im not sure what the jquery one is doing!
Any advice? Thanks
You're loading two different versions of jQuery on your page (1.11.1 first, and then 1.10.2).
Every script tag that contains a plugin that occurs after the first version, but before the second version, will be "overwritten" (and you'll see the error you are getting above).
Please only ever include one version of jQuery on your page.
I added no conflict to the form jQuery and it works fine now.

Keep getting jQuery conflicts, can't resolve

I'm currently updating the website http://www.dev.optiekvandevecht.nl/, I updated it from Joomla 3.3.6 to Joomla 3.4.1. Before updating to 3.4.1, a few lightbox thigns wouldn't work. Right now, I've updated Joomla, and the lightboxes work fine, however, now the nivoSlider seems to be broken (and I suppose it's got to do with jQuery errors, .nivoSlider is not a function.
I honestly don't see what is wrong, it's a Joomla module called ARI Image Slider, but I can't find anything related to the issues I run into.
I deleted an (apparently) unused extension and the problem was solved
It seems like the jquery is already included in any of the extension. Try disabling jquery in any one extension then check it. I hope it would work.

After page refresh jquery stops working

That's realy strange issue, i have quite a lot of plugins and custom scripts in my page and normaly it all works just fine, but if i would try to refresh page, not just click on some link, some of my scripts just stops working, mostly the ones who is changing css properties, my firebug doesn't show any errors, what could be causing something like that?
Answer from original poster:
So the problem was that i used $(document).ready() what i realy needed was $(window).load()
I know this is an old question I stumbled upon. Anyway, my answer might help another when the same problem arises. Unfortunately I haven't got the reputation to comment on Trott's answer above.
That being said, if you are using jQuery 1.8 or any version after his, then use $(window).on('load', function() { ... });. The $(window).load() was deprecated in jQuery version 1.8 and will throw the error jquery url.indexOf is not a function (at least in jQuery 3.4.1)

JavaScript error using latest lightbox

First of all, I'm not good with JavaScript at all. I followed all instructions on this page:
http://www.lokeshdhakar.com/projects/lightbox2/
Visually everything loads fine. However, visual studio throws this error while running. If I hit continue everything seems to be loading fine. I see all buttons, animation, etc. I can only guess that something not loading properly. But not sure..
I think i had the same problem as this. In the end I decided to go with this version of a different lightbox instead as it works like a jQuery plugin
http://leandrovieira.com/projects/jquery/lightbox/
For me I felt it was a lot nicer since it worked with jQuery as a Plugin, and didnt rely on the 6 js files!

replacing page content with .html(content) is not working

I have a weird problem in jQuery. The problem is that I can smoothly use $('#container').html(content) to replace the page content but to specific page. It is not working all around. Gives 'TypeError' message in console. Is there any probability that using SlickGrid can cause such error. Because error is thrown only in that pages where I have used SlickGrid.
Any suggestion would be highly appreciated.
It's hard to tell what's going on with your page, but my guess is that you may have a conflict with the $ between jQuery and SlickGrid. Look at the noConflict function in jQuery - it may help you out.
Call $.noConflict(); before SlickGrid's javascript <script> tag is added, and then refer to jQuery functions by using jQuery(selector) instead of $(selector).
Hope this helps!

Categories