如何在jquery中运行一个函数

I'm a programming newbie, and I can't figure out how to store a function in JQuery and run in it multiple places.

我是一个编程新手，我无法弄清楚如何在JQuery中存储一个函数并在多个地方运行它。

I have:

我有：

$(function () {
  $("div.class").click(function(){
    //Doo something

  });

  $("div.secondclass").click(function(){
    //Doo something
  });

});

Now the 2 "//Doo somethings" are the same, and I don't want to write the same code again.

现在2“// Doo somethings”是相同的，我不想再次编写相同的代码。

If I put:

如果我把：

$(function () {

  function doosomething ()
  {
    //Doo something
  }

  $("div.class").click(doosomething);

  $("div.secondclass").click(doosomething);

});

That would run the function on page load, rather than only when it clicks.

这将在页面加载时运行该函数，而不是仅在它单击时运行。

How do I do this correctly?

我该怎么做呢？

Thanks!

谢谢！

6 个解决方案

#1

108

The following should work nicely.

以下应该很好地工作。

$(function() {

  // Way 1
  function doosomething()
  {
    //Doo something
  }

  // Way 2, equivalent to Way 1
  var doosomething = function() {
    // Doo something
  }

  $("div.class").click(doosomething);

  $("div.secondclass").click(doosomething);

});

Basically, you are declaring your function in the same scope as your are using it (JavaScript uses Closures to determine scope).

基本上，您在与使用它的范围相同的范围内声明您的功能（JavaScript使用Closures来确定范围）。

Now, since functions in JavaScript behave like any other object, you can simply assign doosomething as the function to call on click by using .click(doosomething);

现在，由于JavaScript中的函数表现得像任何其他对象一样，您可以简单地将doosomething指定为使用.click（doosomething）调用点击的函数;

Your function will not execute until you call it using doosomething() (doosomething without the () refers to the function but doesn't call it) or another function calls in (in this case, the click handler).

在使用doosomething（）（没有（）引用函数但不调用它的doosomething）或其他函数调用（在本例中为单击处理程序）之前调用它时，函数将不会执行。

#2

I would do it this way:

我会这样做：

(function($) {
jQuery.fn.doSomething = function() {
   return this.each(function() {
      var $this = $(this);

      $this.click(function(event) {
         event.preventDefault();
         // Your function goes here
      });
   });
};
})(jQuery);

Then on document ready you can do stuff like this:

然后在文档就绪，你可以做这样的事情：

$(document).ready(function() {
   $('#div1').doSomething();
   $('#div2').doSomething();
});

#3

function doosomething ()
{
  //Doo something
}


$(function () {


  $("div.class").click(doosomething);

  $("div.secondclass").click(doosomething);

});

#4

Alternatively (I'd say preferably), you can do it like this:

或者（我最好说），你可以这样做：

$(function () {
  $("div.class, div.secondclass").click(function(){
    //Doo something
  });
});

#5

You can also do this - Since you want one function to be used everywhere, you can do so by directly calling JqueryObject.function(). For example if you want to create your own function to manipulate any CSS on an element:

您也可以这样做 - 因为您希望在任何地方都使用一个函数，您可以通过直接调用JqueryObject.function（）来实现。例如，如果要创建自己的函数来操作元素上的任何CSS：

jQuery.fn.doSomething = function () {
   this.css("position","absolute");
   return this;
}

And the way to call it:

和它的方式：

$("#someRandomDiv").doSomething();

#6

Is this the most obfuscated solution possible? I don't believe the idea of jQuery was to create code like this.There's also the presumption that we don't want to bubble events, which is probably wrong.

这是最混乱的解决方案吗？我不相信jQuery的想法是创建这样的代码。还有一个假设，我们不想冒泡事件，这可能是错误的。

Simple moving doosomething() outside of $(function(){} will cause it to have global scope and keep the code simple/readable.

在$（function（）{}之外简单移动doosomething（）将使其具有全局范围并保持代码简单/可读。

#1

108