Menu
I am trying to chain an anonymous function in jQuery but it's not working. I get an error "Error: XML filter is applied to non-XML value ...". What's the proper syntax or is there an effect function I can use which doesn't do anything visually and which wraps my function?
My example: $item.appendTo($list).(function() {.....}());
956
The syntax is simple: you can simply declare the anonymous function and make it execute by just calling it using the parenthesis at the end of the function. You can simply pass the parameters inside the immediate execution of the anonymous function as we have seen in the above example.
Object-based programming. An anonymous function is a function that was declared without any named identifier to refer to it. As such, an anonymous function is usually not accessible after its initial creation. Normal function definition: function hello() { alert('Hello world'); } hello();
It is a function expression without a name, hence can be called an anonymous function. We define this function and assign it to a variable. To call the function, we simply call the variable passing the required argument, followed by the (). Then, it directly alerts the message as expected.
Anonymous Function is a function that does not have any name associated with it. Normally we use the function keyword before the function name to define a function in JavaScript, however, in anonymous functions in JavaScript, we use only the function keyword without the function name.
Chaining works by returning the original jQuery object as a result of invocation of the given chainable function. Hypothetically, to chain your anonymous functions, you must 'return' the original jQuery object.
However, your function has to be callable from the context of the jQuery object. For example, there exists the function
$item.appendTo
However, there is no function on the jQuery object that is reachable by:
$item.(function(){ })
Think of it like this. Let us say you have the following object:
var obj = { foo: function(){ console.log(1); } };
The 'foo' declaration is accessible as a property/declaration on obj. But what, exactly, is the declaration you are referencing with an anonymous function?
obj.(function(){ })
The only way you could give your anonymous function an execution context of the jQuery object, would be to do a 'call' on it
(function(){ }).call($item, args);
If you were wanting to chain this, you could theoretically do so by:
(function(){ return this; }).call($item, args).appendTo($other);
But I'm not sure what you'd gain. Your best bet is to simply do:
$item.appendTo($list);
(function($obj){ })($item);
Or, if you are starting off with a selector:
var $item = $('#someID').appendTo($list);
(function($obj){ })($item);
Though, at this point anonymous functions aren't as useful, so I would simply:
var someFunc = function($obj){ };
$item.appendTo($list);
someFunc($item);
you can use the .each method
$item.appendTo($list).each( function() {.....} );
Alternatively you can extend the jquery object with your own functions (jQuery.fn.extend()).
$.fn.extend({
myOwnFunc: function(){
/*do whatever*/
return this; // to allow for further chaining.
}
});
and now you can call $item.appendTo($list).myOwnFunc()
34
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
