Question

I have:

<script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
</script>

<div class="demo">
<p>Date: <input id="datepicker" type="text"></p>
</div>

When I click in the datepicker box the datepicker appears, as expected.

Question: How does jquery know to run that function when I click on the box and not another function?

If I want to add a function for something else, how would jquery know which to refer to?

I am used to using php where all functions have a name and you refer to them by the name…

Answer 1

$ is the name of a function.

That function, when executed, returns an object.

That object has the property datepicker.

---

Think of it like this:

var a = {
   datepicker: 'asdf'
};

function b() { return a; };

var c = b().datepicker;

---

The object that is being returned by $ is a “wrapped set” of elements. That is an input argument into the datepicker plugin.

So in other words, it’s like this:

var a = 'asdf';

function b(val) {
   alert(val);
}

b(a);

// How does the alert box know how to say "asdf"?