This question already has answers here:
Why does click event handler fire immediately upon page load?
(4 answers)
Closed 3 years ago.
I have two scripts:
<script src="../js/createopp.min.js"></script>
<script src="../js/validation.min.js"></script>
This following line is in the first script, calling a function in the other one:
$('#places').blur(function(){checkPlacesAvailable()});
If I rewrite this as
$('#places').blur(checkPlacesAvailable());
I get a "not defined" error on the function. But I see many examples where the second format is used. Is there something obvious stopping the second version from working in my case?
You should pass function references to event handlers like that.
$('#places').blur(function(){checkPlacesAvailable()});
"is" "equivalent" to this
$('#places').blur(checkPlacesAvailable);
Note that it is not exactly the same because of scopes and all that but most of the times you can pass it in the second manner
This code:
$('#places').blur(checkPlacesAvailable());
start your function immediatly. If you don't want to write "function" you can make this:
$('#places').blur(() => checkPlacesAvailable());
Related
This question already has answers here:
jQuery $(function() {}) vs (function () {})($) [duplicate]
(3 answers)
Closed 3 years ago.
What is the difference between (function(){})(); and $(document).ready(function ())
First: (function(){})();
Second: $(document).ready(function ())
I have a question about it.
if I use it in the first option, there is an error when I click it. The Error is that it does not work and there is no error.
but if I use the second one, there is no error. It is not working.
what is the difference between to two ?
This will execute immediatly:
(function(){
console.log("Called immediately invoked function expression");
})();
Where as, the function passed to jQueries $.ready() function will execute when the document can be safely manipulated:
$(document).ready(function () {
console.log("The document is safe to be interacted with");
});
The reason the first method causes errors is likely because the HTML document is not ready for interaction at the time that your function is called (ie immednaitly).
The second approach will however ensure that (in most cases), any scripts, HTML, or other resources (which the JavaScript defined in that function might depend on) are loaded and present before that function is invoked.
This question already has answers here:
jQuery best practices in case of $('document').ready
(9 answers)
Closed 4 years ago.
Does this:
$(document).ready(function(){
alert("Hello World");
});
And this:
(function($){
alert("Hello World");
})(jQuery);
do the same thing?
The former is what I commonly use and the second I have seen used in several plugins. Are they the same, if not then what are their differences and which one to use when?
They are not the same.
The former is a document.ready event handler. It will run as soon as the DOMContentLoaded event fires. It can also be written like this:
$(function() {
alert("Hello World");
});
The latter is an Immediately Invoked Function Expression (IIFE). This will be executed immediately (as the name implies). Therefore you need to manually ensure that the DOM is in a state ready to be interacted with before you execute this logic. You can generally do this by placing the script at the end of the body tag, or within it's own document.ready handler. The latter is a little redundant when working with jQuery, though.
This question already has answers here:
When to use () after a callback function name? [duplicate]
(5 answers)
Closed 6 years ago.
Well I'm starting with jQuery and I'm wondering what is the difference between writing a function with or without parentheses inside a function.
For example if I have the following function:
function test(){
alert("pen pineapple apple pen");
}
This:
$(document).ready(test);
and this:
$(document).ready(test());
both show the same result: "pen pineapple apple pen"
Putting parentheses () at the end of a function causes that function to be invoked immediately, and use its return value in the expression.
This code $(document).ready(test); is using test as a callback function. It essentially says: when the document becomes ready, call the function that I'm providing you with (test).
This code $(document).ready(test()); is immediately invoking the function test, having it return a value, and then passing that value to the ready method. It's possible that test is returning a different function here, which in turn will act as the required callback function. It could also just be an error though, with someone inadvertently including the parentheses when they shouldn't have.
This question already has answers here:
What is a callback function?
(22 answers)
Closed 7 years ago.
$("p").click(function(){
// action goes here!!
});
In the above jquery code why we pass a function() to the event?
It's called a callback or an anonymous function that you want executed when the event happens. You'll notice it's not just jQuery, but almost all Javascript frameworks will expect one. It's usually whenever you are binding to events, executing functions that might take a while to return, or functions that execute other functions.
But you can also provide it a function name if you want.
function clickedMe(){
alert("Something clicked me");
}
$("p").click(clickedMe)
Because the click method is defined this way (the method parameter ).
See:
click
You have to understand its not a default JavaScript method, this method is defined in the JQuery so you have to call it as it is defined in the method.
Behind the scene actually when JQuery registering any event with DOM its only says to do one thing which is calling your provide method.
The simplest answer: according to documentation.
https://api.jquery.com/click/
When a user clicks a p element, jQuery is supposed to fire an event and execute something. How is it supposed to pass actions, if not using functions?
This question already has answers here:
Calling a function in JavaScript without parentheses
(7 answers)
Closed 9 years ago.
I have javascript script code here. When I execute my code as it is then it does not trigger func_two function. But when I change following code in func_one
if (this.remove) {
this.func_two;
}
to this
if (this.remove) {
this.func_two();
}
Then it does trigger second function. But I want to trigger it this way this.func_one. IS it possible to do it this way? How?
You have to put () when you call a function, you can't just, out of nowhere, decide that you want it to work another way.
Take a look at this answer, it may help you.
this.func_two;
This statement return the function. It does not call the function. To call the function you have to add () at the end. or you have to do it like:
f2=this.func_two;
f2();