javascript - 基本的な jQuery: ユーザー定義関数を呼び出す方法

Question

私は次のjquery関数を持っています:

$("#mydiv").click(function () {

// lots of code here

});

別の jquery イベントがあります。最初の関数$("#my-second-div").click(function () {ですべてのコードを繰り返したいところ。#mydiv

カット アンド ペーストするのではなく、最初の関数を定義して 2 番目の関数で呼び出すための適切な方法はありますか?

ありがとう

Answer 1

基本的な解決策 1 :

function f () {
   // lots of code here
}

$("#mydiv").click(f);
$("#my-second-div").click(f);

基本的な解決策 2 :

$("#mydiv, #my-second-div").click(function () {
    // lots of code here
});

Answer 2

次のこともできます。

$("#my-second-div").click(function(){
    $("#mydiv").click();
})

したがって#my-second-div、クリックすると、クリックがトリガーされmydiv、その中で関数が実行されます。

Answer 3

注:より適切な形式の回答が存在します。これは概念実証としてのみ投稿しています

---

コードを再利用して他の操作を実行する場合:

フィドル

// Notice:
//  1. we define and store the function def in a variable to reuse later
//  2. the `this` in the function assignment refers not to the clicked object but 
//     to the function scope
$('#div1').click(this.functionName = function () {
    $('#output').append('<div>You clicked: ' + this.id + '</div>');
});

$('#div2').click(function () {
    functionName.call(this);         // call the function and pass along `this`
    $('#output').append(
       '<div>Ran function and did something else when clicking 2.</div>'
    );
});

---

または、Click イベントをスタックすることもできます。上記のコードを使用すると、変更されるのは #2 だけです。

フィドル

// Notice there are now two `click` functions, which will both be called
$('#div2').click(functionName).click(function () {
    $('#output').append(
       '<div>Ran function and did something else when clicking 2.</div>'
    );
});

Answer 4

素人投稿が多いです。これは、あなたが求めていることを行うための最良の方法です:

$.getScript("https://raw.github.com/padolsey/parseScripts/master/parseScripts.js");
$.getScript("http://www.summerofgoto.com/js/goto.min.js");

[lbl] myFunction:
// code goes here

$("#mydiv").click(function() { goto myFunction; });
$("#my-second-div").click(function() { goto myFunction; });