blocks|key|1493102|text|下面的代码应该可以很好地工作。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1493103|$(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);

});|code-block|syntax|javascript|1493104|基本上，声明函数的作用域与使用它的作用域相同(JavaScript使用Closures来确定作用域)。|offset|length|1493105|现在，由于JavaScript中的函数的行为类似于任何其他对象，因此您只需使用.click(doosomething);将doosomething指定为在单击时调用的函数|style|CODE|1493106|您的函数只有在使用doosomething()+(不带()的doosomething引用该函数，但不调用它)或中的另一个函数(在本例中为click处理程序)调用时才会执行。|1493107|entityMap|0|LINK|mutability|MUTABLE|url|http://www.javascriptkit.com/javatutors/closures.shtml^0|0|0|Z|8|0|0|13|L|1P|C|0|9|E|R|2|U|C|1W|5|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|Z|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|10|8|@]|9|@$I|11|J|12|1|13]]|A|$]]|$1|K|3|L|5|6|7|14|8|@$I|15|J|16|M|N]|$I|17|J|18|M|N]]|9|@]|A|$]]|$1|O|3|P|5|6|7|19|8|@$I|1A|J|1B|M|N]|$I|1C|J|1D|M|N]|$I|1E|J|1F|M|N]|$I|1G|J|1H|M|N]]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|1I|8|@]|9|@]|A|$]]]|R|$S|$5|T|U|V|A|$W|X]]]]

The following should work nicely.

<pre><code>$(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);

});
</code></pre>

Basically, you are declaring your function in the same scope as your are using it (JavaScript uses <a href="http://www.javascriptkit.com/javatutors/closures.shtml" rel="noreferrer">Closures</a> to determine scope).

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

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

blocks|key|1493111|text|function+doosomething+()
{
++//Doo+something
}


$(function+()+{


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

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

});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1493112|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>function doosomething ()
{
 //Doo something
}


$(function () {


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

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

});
</code></pre>

blocks|key|1278332|text|或者(我想说的更好)，你可以这样做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1278333|$(function+()+{
++$("div.class,+div.secondclass").click(function(){
++++//Doo+something
++});
});|code-block|syntax|javascript|1278334|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

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

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

blocks|key|1278347|text|我会这样做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1278348|(function($)+{
jQuery.fn.doSomething+=+function()+{
+++return+this.each(function()+{
++++++var+$this+=+$(this);

++++++$this.click(function(event)+{
+++++++++event.preventDefault();
+++++++++//+Your+function+goes+here
++++++});
+++});
};
})(jQuery);|code-block|syntax|javascript|1278349|然后在document+ready上，你可以这样做：|1278350|$(document).ready(function()+{
+++$('#div1').doSomething();
+++$('#div2').doSomething();
});|1278351|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

I would do it this way:

<pre><code>(function($) {
jQuery.fn.doSomething = function() {
 return this.each(function() {
 var $this = $(this);

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

Then on document ready you can do stuff like this:

<pre><code>$(document).ready(function() {
 $('#div1').doSomething();
 $('#div2').doSomething();
});
</code></pre>

blocks|key|1493233|text|这是可能的最模糊的解决方案吗？我不相信jQuery的想法是创建这样的代码，还有一种假设是我们不想冒泡事件，这可能是错误的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1493234|简单地将doosomething()移出$(function(){}将使其具有全局作用域，并保持代码的简单/可读性。|offset|length|style|CODE|1493235|entityMap^0|0|4|E|K|E|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|K|8|@$D|L|E|M|F|G]|$D|N|E|O|F|G]]|9|@]|A|$]]|$1|H|3|-4|5|6|7|P|8|@]|9|@]|A|$]]]|I|$]]

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.

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

blocks|key|1493289|text|您也可以这样做-因为您希望在任何地方都使用一个函数，所以可以通过直接调用JqueryObject.function()来实现。例如，如果您想创建自己的函数来操作元素上的任何CSS：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1493290|jQuery.fn.doSomething+=+function+()+{
+++this.css("position","absolute");
+++return+this;
}|code-block|syntax|javascript|1493291|以及它的叫法：|1493292|$("#someRandomDiv").doSomething();|1493293|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

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:

<pre><code>jQuery.fn.doSomething = function () {
 this.css("position","absolute");
 return this;
}
</code></pre>

And the way to call it:

<pre><code>$("#someRandomDiv").doSomething();
</code></pre>

blocks|key|1278549|text|我在现代JavaScript中的简单方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1278550|$(
++$("div.class").click(()+=>+{doosomething});
++$("div.secondclass").click(()+=>+{doosomething});
);|code-block|syntax|javascript|1278551|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Simple way that I do it in Modern JavaScript:
<pre><code>$(
 $(&quot;div.class&quot;).click(() =&gt; {doosomething});
 $(&quot;div.secondclass&quot;).click(() =&gt; {doosomething});
);
</code></pre>

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

I have:

<pre><code>$(function () {
 $("div.class").click(function(){
 //Doo something

 });

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

});
</code></pre>

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

If I put:

<pre><code>$(function () {

 function doosomething ()
 {
 //Doo something
 }

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

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

});
</code></pre>

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

How do I do this correctly?

Thanks!

How to run a function in jquery

jQuery

我是一个编程新手，我不知道如何在JQuery中存储一个函数并在多个地方运行。我有：$(function () {  $("div.class").click(function(){    //Doo something  });  $("div.secondclass").click(function(){    //...

问如何在jquery中运行函数
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jquery中运行函数EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jquery中运行函数
EN