Question

我有：

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

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

当我点击datepicker框时，会出现datepicker，如预期的那样。

问题：当我点击框而不是其他功能时，jquery如何知道运行该功能？

如果我想为其他东西添加一个函数，jquery将如何知道引用哪个？

我习惯使用php，其中所有函数都有一个名称，你可以通过名称来引用它们。

Answer 1

$是函数的名称。

该函数在执行时返回一个对象。

该对象具有属性datepicker。

这样想：

var a = {
   datepicker: 'asdf'
};

function b() { return a; };

var c = b().datepicker;

$返回的对象是元素的“包装集”。这是datepicker插件的输入参数。

换句话说，就像这样：

var a = 'asdf';

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

b(a);

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

Answer 2

.datepicker()是一个扩展名，它可能有一个事件处理程序，它分配给应用该函数的元素。

Answer 3

$本身就是一个功能。

See the source here

Answer 4

$("#datepicker")将选择ID为datepicker的元素，并在其上调用函数.datepicker()将设置必要的事件处理程序和逻辑。

Datepicker是jQuery UI的一部分，源代码为available here。

如果您想自己扩展jQuery，请查看Plugins/Authoring。基本上，插件具有以下结构：

(function($) {
    $.fn.someFunction = function() {
        // `this` refers to the selected elements
        return this.on('click', function() {
            alert('42');
        });
    };
}(jQuery));

现在，当您在所选元素$('div').someFunction()上调用此函数时，它会将click事件处理程序绑定到它们。

DEMO

.datepicker()也在做同样的事情，虽然要复杂得多。

Answer 5

我假设你指的是这部分代码：

$(function(){});

jQuery基于DOM元素。 $（函数（）{}）;是$（document）.ready（function（）{}）;

的简写

此事件附加到document元素，并在触发ready事件时运行。所以在这个例子中，ready是函数名，就像你可能在php中有一个名为ready的方法一样。只是jQuery为您提供了一种调用它的简写方式。

Answer 6

datepicker插件根据您传递的ID绑定事件。

在jQuery中，您可以将任意数量的事件绑定到一个元素，然后它将运行您为事件分配的函数。

e.g。

$('#mybutton').click(function() { 
    // handle the click event 
});

$('#mytextbox').focus(function(){
    // handle the focus event
});

OR

$('#mybutton').bind('click', function(){
   // handle the click event.
});

在datapicker插件中，click事件绑定到文本框，然后它调用插件中的一个函数，然后生成日历弹出窗口的代码。

Answer 7

在javascript中，DOM中的对象（您的HTML元素）具有事件的概念，即它们可以具有绑定到元素可以响应的特定操作的函数。一个非常常见的事件，也就是datepicker可能使用的事件，是click事件。因此，当您调用$( "#datepicker" ).datepicker();时，在datepicker函数内部，另一个函数被绑定到id为click的元素的datepicker事件。您也可以将多个功能附加到单个事件中。

所以实际上，datepicker函数更像是一个设置例程，当您实际单击该元素时，您将触发另一个绑定到其中一个元素事件的函数，而不是原始的datepicker你打电话的功能。

Answer 8

.datepicker（）的一部分是click事件的附件。当您单击#datepicker时，javascript将运行附加到该事件的所有函数。所以，如果你这样做：

$('#datepicker').datepicker();
$('#datepicker').click(function(){
    alert('clicked');
});

将发生日期选择器和警报。除非您从附加到它的函数中取出UNBIND #datepicker，否则情况将继续如此。

Answer 9

您的标记可能包括对jQuery库的脚本引用以及jQueryUI库或＆＃34; datepicker＆＃34; jQuery插件。

我假设正在使用jQueryUI。 jQueryUI包含一个datepicker小部件，该小部件在此引用包含库时注册。小部件使用jQuery注册自己，使其可用于DOM元素集合。

$（＆＃39; #datepicker）本身创建了一个引用DOM元素的jQuery对象集合。添加或链接＆＃34; .datepicker（）＆＃34;像这样的集合$( "#datepicker" ).datepicker();，使用集合作为其上下文调用datepicker小部件，并将自己的事件和方法应用于集合中的每个DOM元素。这包括＆＃34;点击＆＃34;单击输入字段时触发的事件，显示日历以及datepicker窗口小部件提供所需功能所需的任何关联控件。

jquery如何知道运行哪个函数？

9 个答案: