$ is not a function although jQuery is loaded - javascript

Firebug says "$ is not a function" although jQuery is loaded (twice!) on this site:
http://www.magiskecirkel.no/
Can anybody tell me why? :-)
Thanks!

jQuery is set to no conflict mode on that page:
$wpbr = jQuery.noConflict();, so it's not bound to the $ function but to $wpbr.

You're using wordpress, which I believe includes the prototype library. Prototype overwrites the '$' function provided by jquery: http://elementdesignllc.com/2009/08/wordpress-jquery-is-not-a-function/
you might want to check out noconflict mode: http://api.jquery.com/jQuery.noConflict/

There's a bit which lets jQuery use the name jQuery instead of $, and perhaps you've got that turned on.

Related

Adjusting jQuery to work on Wordpress (syntaxerror)

I have a line of code that has a "$" value in it, which Wordpress doesn't seem to accept. How to adjust the "$", so that Wordpress will read it correctly?
jQuery(document).bind('gform_post_render',function(){
jQuery('#input_24_4').change(function(){
jQuery('#input_24_3').data('amount',$(this).val());
});
});
$ should be an alias of jQuery, anyway, for some reason $ is not defined sometimes. You can fix it by using an anonymous function:
(function($) {
$(document).bind('gform_post_render',function() {
$('#input_24_4').change(function(){
$('#input_24_3').data('amount',$(this).val());
});
});
})(jQuery);
Also, make sure you've loaded jQuery library before embedding / executing this piece of code.
Where is this line of code? If it's part of a double-quoted string in any of your PHP files, you need to escape the $ with a backslash: \$
Apart from that, jQuery runs in noConflict mode in Wordpress. That means, it doesn't set the global $ variable, just the jQuery name.
If you want to change that, you need to set it yourself somewhere before this line:
window.$ = window.jQuery;

Conflict in ES6 String Interpolation and jQuery $

STUPID QUESTION : DON'T BOTHER
I am newbie in ES6 and following this guide here to get started. I looked at the following code and been thinking since then.
function printCoord(x, y) {
console.log(`(${x}, ${y})`);
}
So we use ${VARIABLE} to get it's value as string. Now if I were to use jQuery as $ would it conflict with the above code? or jQuery would just ignore anything in between `` ?
Would we be able to do something like...
console.log(`(${ $('.selector').text() })`);
Would it require me to use jQuery as jQuery everywhere?
I made a jsfiddle. (Added jQuery, babel as language)
http://jsfiddle.net/kamikazefish/hd1Le21z/
<div class="selector">This is the text in the selector</div>
console.log(`(${ $('.selector').text() })`);
alert(`(${ $('.selector').text() })`);
Seems like it works.

How to create a catch all function on a jQuery object?

I was previously using the jQuery autosave plugin but have recently removed it. Some code is still trying to use this function, so how can I temporarily extend the jQuery object so there is an empty function to prevent errors until I can get through all of the code that is trying to use the function?
The plugin is called in this way:
jQuery().autosave.restore();
jQuery().autosave.save();
I think those are the only two functions that exist, so it would be OK to create two empty functions, but is there a way to create a catch-all function on this type of object?
Note
This is a temporary solution until I can go through a lot of code. I do believe the question is a valid coding question even if you think this workaround is not ideal (it isn't).
There is a way to do this. You can create a dummy plugin (check out jQuery's documentation for creating plugins):
(function( $ ){
$.fn.autosave = {
restore: function() {};
save: function() {};
};
})( jQuery );
I would highly recommend against doing this, however. Instead, you should look at those errors and fix them, i.e., stop your code from using them. Otherwise you're simply hiding the problem.
Nope. Standard JavaScript does not support "catch-all" methods.

$ vs. jQuery: Which should I use?

What is the diffrence between them? Which is better?
$ is an alias for jQuery, neither is "better" really, jQuery is provided in case something else is using $, like Prototype (or jQuery.noConflict() was called for another reason...).
I prefer $ for brevity because I know it refers to jQuery, if you're unsure (like when writing a plugin) use jQuery for your primary reference, for example:
(function($) {
//inside here $ means jQuery
})(jQuery);
The functionality is identical if there is no conflict.
Use 'jQuery' instead of '$' to be especially explicit/descriptive, or if you currently use or anticipate using another library that defines '$'.
See also http://api.jquery.com/jQuery.noConflict/
jQuery == $ == window.jQuery == window.$
jQuery and $ are defined in window, and $ can be used if no other library is making use of it, thus creating conflicts.
Either use jQuery.noConflict() or closures:
(function ($) {
// code with $ here
})(jQuery)

How to make custom, no editing need, bulletproof jquery's noconflict version?

in my job i always have to use jquery with prototype can i make any custom jquery with library file like once i will add in head and then no need to change anything in any code.
is it possible?
I don't want to change anything in an code $ to jQuery.
from http://www.cssnewbie.com/runing-jquery-with-other-frameworks-via-noconflict/
Keeping it Short
The noConflict mode does have one other bit of functionality that I’ve found useful in some of my projects: you can select a different variable to use instead of the standard “jQuery”. The usage looks like this:
var $j = jQuery.noConflict();
Now in addition to using the default jQuery() notation, I can also use the shorter $j() notation. This allows me to avoid running into problems with other frameworks, while still enjoying almost the same conciseness in my code.
This just begs the question why dont you simply implement all your stuff in Prototype then - or implement everything in jQuery. Overall they both have the same capabilities.
However to directly answer your question - ther isnt really a way to make a custom build of jQuery. But you could simply put your noConflict call immediately following your inclusion of the jQuery library.
Then for your stuff you can simply wrap it all in
(function($){
// your jQuery code here... Can be used with $ as normal.
})(jQuery);
within that function youll be able to use $ as the alias - outside of it you would need to use jQuery. The only gotcha here is that if you want a variable defined inside here to be global youll need to make it that way manually as everything within this will be scoped to the function. You can do this like so:
(function($){
window.myGlobalVar = 'This is a global variable';
})(jQuery);
The best thing is often to wrap the $ in a private scope:
(function($) {
// jQuery stuff
})(jQuery)
You can also call the jQuery.noConflict() function before the wrap: http://api.jquery.com/jQuery.noConflict/
Another clean option is chaining the noConflict() into a domReady callback:
jQuery.noConflict()(function($){
// code using jQuery or $
});
console.log(typeof $ === 'undefined') // prints true
To address your question of whether you can have an "include-once" file, yes, you could do something similar to:
/* MyLibLoader.js */
document.write("<script type='text/javascript' src='prototype.js'></script>");
document.write("<script type='text/javascript' src='jquery.js'></script>");
window.$j = jQuery.noConflict();
And then in HTML
<head>
<script type='text/javascript' src='MyLibLoader.js'></script>
</head>
But this approach assumes you're happy to change your jQuery usage to $j

Categories