how to call a function with passing parameter? - javascript

i want to pass the event to function in javascript suppose. i am fire function from two input. then how i can call the event with passing parameter.
can i do this using calling and without binding event in jQuery.

I'm not exactly sure what you're asking, but here's an example of passing a function with parameters as a callback:
setTimeout(function() {
return myFunction(false, 3);
}, 1000);
You wrap your function call in an anonymous function wrapper.

Example:
function DoCSSStuff(param1,param2)
{
$(param1).css('height', param2);
};
That way you could call the css function to manipulate height with passed parameters.

Related

Passing parameters to callbacks JavaScript

I would like for a callback function to fire after a click event. Currently I have the JavaScript
$('#btnSubmit').click(function ()
{
$('#testDiv').hide('slow', onComplete('test'));
});
var onComplete = function (t)
{
$('#hiddenDiv').hide();
alert(t);
}
The callback function is supposed to be fired after the hiding of #testDiv. However, the onComplete function fires first. If I remove the parameters on onComplete and just give it a reference and not invoke it, then the function fires at the right time, but I can't pass parameters to it. How can I pass parameters to onComplete and not have it fire before the div is finished hiding?
fiddle here
You have to actually have a anonymous function there wrapping your onComplete():
$('#btnSubmit').click(function () {
$('#testDiv').hide('slow', function () {
onComplete('test')
});
});
Demo here
In the jQUery docs:
complete
Type: Function()
A function to call once the animation is complete.
When adding onComplete() without a wrapping function the function will be called immediately, otherwise you need to reference it just with onComplete, but then you cannot pass your value unless you use .bind() to pass your parameter.
Use anonymous function:
$('#btnSubmit').click(function () {
$('#testDiv').hide('slow', function () {
onComplete('test')
});
});
You can use .bind() :
$('#testDiv').hide('slow', onComplete.bind(null, 'test'));
The first parameter is the value this will have in the onComplete function. All other parameters are the argument list.

Is this a correct way of JavaScript/jQuery callback?

This is a simple question. Here is my code:
$(document).ready( function () {
func1( "foo", callback);
function callback(param){
alert(param+" is my name");
}
function func1(name, cb) {
cb(name); // alerts "foo is my name"
callback("bar"); // alerts "bar is my name"
}
});
I want to know:
Which one of the function calls inside func1 is the correct callback and why?
Or are they both correct?
Isn't callback("bar"); a normal function call?
Callbacks are meant to let a caller specify what a function should do at some defined point in that function's execution. The function being called shouldn't know the name of that callback function ahead of time. So they'll often be passed to a function as an argument and the function that's supposed to call the callback should just invoke that argument.
When you call callback("bar") in func1, you're totally missing the point of callbacks. You may be invoking the function that you happen to use as a callback, but the point of callbacks is that func1 isn't supposed to know about that. It's just supposed to call the function that's been passed in as an argument (cb). When I'm calling func1 I should be able to pass a completely different callback function and func1 should just call that function without knowing what its name is (it may not even have one!).
The "correct" way is cb(name).
callback("bar"); is directly invoking the callback function where as cb(name); calls the reference passed to the func1,
cb(name); seems to be the correct way here.
First one. Function calls another one which has been pased as a parameter.
It seems like most jquery methods follow this this form for callbacks:
$(SUBJECT).method(function() {
//do stuff
}, /*callback here*/ function(){
//do stuff
});
like for instance
$(foo).click(function() {
$(bar).fadeIn(300, function(){
//call back here
});
});
fiddle

passing arguments to click function in jquery fires the function without clicking

Hi
I have a function that makes ajax calls once an element is clicked. I use this code:
$(document).ready(function()
{
function ajax_call(offset, length) {
$.ajax({method: "get",
url: "file.php",
data: "offset="+ offset,
success: function(returnedData)
{
$("#content").html(returnedData);
}
});
}
$("#profile").click(ajax_call(0, 1000));
});
The issue is with this line:
$("#profile").click(ajax_call(0, 1000));
When I pass arguments to ajax_call function, the function is run once the page loads without any user intervention, however when I remove the arguments like this:
$("#profile").click(ajax_call); the function is called only when the element is clicked. I have researched for hours about this issue but with no luck
This will call the function immediately ajax_call(0, 1000) and pass the return value as event handler.
You have to wrap it in an anonymous function:
$("#profile").click(function() {
ajax_call(0, 1000);
});
Whenever you have functionname() you are actually calling the function. functionname instead (without parenthesis) gives you a reference to the function. As you cannot just pass ajax_call to click, you have to wrap it in another function.
So the anonymous function function(){...} is passed as event handler and when it gets called, it executes ajax_call(0, 1000).

JavaScript: How to pass an anonymous function as a function parameter?

I would like to write a function that accepts an anonymous function as a parameter. For example:
run('param1', function(){
alert('execute this');
});
function run(param1, callback) {
//now execute the callback parameter as a function
}
How can I achieve something like this?
callback() would invoke it.
If you need to supply a context, do callback.apply(this, arguments). When you use .apply be aware of the current execution context, basically know what this will refer to, or your code will not work as expected if you are feeding a literal that references this inside it's function body.

to call a javascript function periodically

I want to call function with arguement periodically.
I tried setTimeout("fnName()",timeinseconds); and it is working.
But when I add an arguement it won't work. eg: setTimeout("fnName('arg')",timeinseconds);
You can add an anonymous function:
setTimeout(function() { fnName("Arg"); }, 1000);
Use an anonymous function, like this:
setTimeout(function() { fnName('arg'); }, time);
In general, never pass a string to setTimeout() or setInterval() if you can avoid it, there are other side-effects besides being bad practice...e.g. the scope you're in when it runs.
Just as a side-note, if you didn't need an argument, it's just:
setTimeout(fnName, time);
setTimeout accepts an expression or a function name or an anonymous function but NO () operator.
() will start executing the function immediately and results in setTimeout accept an invalid parameter.

Categories

Resources