Call JavaScript function in a jQuery chain

function jsFunc() {
  alert('i am js!');
}

$('#node').slideDown().call(jsFunc());

Of course, the function isn't called 'call'.

** EDIT **

(Added solution on behalf of the OP).

Solution

http://jsfiddle.net/gx2mJ/1/

or

HTML:

<div id="content">
    <p class="article">
        this is an article
    </p>
</div>

JavaScript:

function callBack() {
    $("#content .article").html("the callback has been called");
}

$(document).ready(function() {
    $("#content开发者_开发知识库 .article").slideUp(0);

    $("#content .article").each(function(i) {
        $(this).delay(i*250).slideDown(function(){
             //if ($("#content .article:animated").length < 1) {
                  callBack();
             //}
        });
    });
});

---

You can't do that by default, but you could easily add it as a plugin:

$.fn.call = function (fn, args, thisp) {
    fn.apply(thisp || this, args);
    return this; // if you want to maintain chainability -- other wise, you can move the return up one line..
}

Though I'm not sure why you would want to do that. If you're thinking it won't be run until after the slide is done, then you'd be wrong because jQuery animations are asynchronous.

---

why not just use a callback function? almost all jquery functions have them.

$('#node').slidedown('normal', function(){jsFunc()})

---

$("#content article").each(function(i) {
    $(this).delay(i*250).slideDown();
}).callBack();

The whole reason for having the callback in the chain is so it will run AFTER all the animations have taken place.

try this instead,

$("#content .article").each(function(i) {
    $(this).delay(i*250).slideDown(function(){
         if ($("#content .article:animated").length < 1) {
              callBack();
         }
    });
});

the same problem

---

What is your objective of calling the jsFunc()?

If you want it as a callback you can use the sysntax given here ex:

$('#node').slidedown('normal', function(){jsFunc()}).

But if you want the function jsFunc to be able to call as a plugin, you need to write a plugin as suggested by CD Sanchez.

I think again there is one issue in your sample code, you are calling the function jsFunc and passing the value returned by jsFunc as an argument to the call function. If you want to pass the function jsFunc as the callback function you need to use the syntax

$('#node').slideDown().call(jsFunc);

---

(Added solution on behalf of the OP).

Solution

http://jsfiddle.net/gx2mJ/1/

or

HTML:

<div id="content">
    <p class="article">
        this is an article
    </p>
</div>

JavaScript:

function callBack() {
    $("#content .article").html("the callback has been called");
}

$(document).ready(function() {
    $("#content .article").slideUp(0);

    $("#content .article").each(function(i) {
        $(this).delay(i*250).slideDown(function(){
             //if ($("#content .article:animated").length < 1) {
                  callBack();
             //}
        });
    });
});

---

$("#content article").each(function(i) {
    $(this).delay(i*250).slideDown();
}).callBack();

The whole reason for having the callback in the chain is so it will run AFTER all the animation triggers have taken place.