1

请看下面的函数：

<script type="text/javascript"> 

$(function() 
{

    var dataresult = 0;

    $("#Structure #Toggle").click( function()       
    {
        if($("#Structure #Toggle").data("currentstage") )
        {           
            $("#AdvancedOptions").hide();
            $("#Structure #Toggle").html("Show Advanced Options");
            $("#Structure #Toggle").data("currentstage", false);
        }
        else
        {
            $("#AdvancedOptions").show();   
            $("#Structure #Toggle").html("Hide Advanced Options");
            $("#Structure #Toggle").data("currentstage", true);
        }           
    });

这里我注意到一个$(function()有另一个函数定义就行了 $("#Structure #Toggle").click( function() ，这是什么意思？

4

5 回答 5

0

$(function(){告诉 jQuery 在文档加载后立即执行此函数。一旦发生这种情况，$("#Structure #Toggle").click( function()就在 ID 为“Structure”/“Toggle”的（过度限定的）DOM 元素上注册一个点击事件的监听器。它首先选择该元素，然后添加另一个函数的单击侦听器。

于 2013-11-01T22:39:29.930 回答
0

$(function() {...});在加载 DOM 后执行该函数；它的缩写：

$(document).ready(function() { ... });

当该函数运行时，它会执行：

$("#Structure #Toggle").click(function() { ... });

这会将内部函数绑定到元素click上的事件#Structure #Toggle，以便在您单击该函数时执行该函数。

于 2013-11-01T22:40:56.893 回答
0

没有什么特别的意思。这实际上只是另一个功能。

通常，JS 中的函数只是另一个对象。它与我们拥有的任何其他类型没有任何不同——数字、字符串、数组等。有两种方法可以将函数分配给名称。首先我们有

function something () {}

这基本上只是一个捷径：

var something = function () {}


在该语句的第二种形式中，很明显，该函数只是该变量的一个值。而且，与所有值一样，您可以将它们作为参数传递给函数。

也就是说，这里做了什么：首先，有一个函数 $，它可以将一个函数作为它的第一个参数。所以我们给它一个。在该函数内部，我们调用另一个函数：$(...).click()。该函数再次接受一个函数作为参数 - 所以我们给它一个。就是这样，这里没有魔法;）

于 2013-11-01T22:42:40.553 回答
0

这是因为 JavaScript 将函数视为第一类原语。考虑以下语句：

jasons_age = 20;

以及以下条件：

function canDrinkInTheUS(age) {
  if(age>21) {
     return true;
  } else {
     return false;
  }
}

你这样称呼它：

canDrinkInTheUS(jasons_age);

在这里，一个变量 ( age) 的值被分配了一个值 ( 20)，在 14 年前它canDrinkInTheUS(jasons_age)会返回 false。但是，您现在正在阅读此答案，此时它将不再准确。表达我的年龄的更好方法是作为函数。在 JavaScript 中，您可以创建age一个函数，可能像这样（使用这个聪明的年龄计算器）：

jasons_age_right_now = function() {
  return ~~((Date.now() - new Date(1978,12,25)) / (31557600000));
};

这允许更新我们的 canDrinkInTheUS 函数以将函数作为参数：

function canDrinkInTheUS(age) {
  if(age()>21) {
     return true;
  } else {
     return false;
  }
}

为了调用它，我们通过jasons_age_right_now这样的方式：

canDrinkInTheUS(jasons_age_right_now);

请注意，您没有添加()和 的结尾jasons_age_right_now，这是因为直到我们在里面才调用该函数canDrinkInTheUS。

因为 JavaScript 允许您将函数作为参数传递，您甚至可以返回一个本身接受参数的函数，如下所示：

anyones_age_right_now = function(date_of_birth) {
  return function() {
    return ~~((Date.now() - date_of_birth) / (31557600000));
  };
};

然后更改jasons_age_right_now为如下所示：

jasons_age_right_now = anyones_age_right_now(new Date(1978, 12, 25));

因为jasons_age_right_now是一个函数，所以它可以传递给更新的canDrinkInTheUS().

于 2013-11-01T23:01:57.740 回答
0

在 Javascript 中，可以在其他函数中包含函数。在你的情况下

$(function() {/*...*/})

是加载文档时执行的函数。在此事件中，您有一个函数，该函数归因于与选择器匹配的任何标签的点击事件

$("#Structure #Toggle")

因此，在加载文档后，事件被定义并且只要标签存在，它们就会监听与函数关联的点击事件，该函数作为点击事件的参数传递给匹配选择器的标签。

我注意到您的选择器包含两个 id：

$("#Structure #Toggle")

如果您没有特定的理由这样做，那么最好有

$("#Toggle")

相反，由于 ids 应该是唯一的，因此您的 Toggle id 标识了选择器匹配的标签。最好尽可能保持简单。

此外，如果您一次又一次地查询相同的标签，对健康不利。

而不是重复

$("#Structure #Toggle")

一次又一次地执行以下操作：

var structureToggle = $("#Structure #Toggle");

并且在您需要的时候

$("#Structure #Toggle")

稍后只需使用您的structureToggle变量。

于 2013-11-01T23:11:04.710 回答