グローバル変数は

Question

あなたはjQueryの中で複数の機能で使用できる変数、例を含むことができることができる機能します私はこれを続ける必要はありません：

$('#title').click(function() 
{ 
    var self = $(this); 
    var box = self.parents('.box'); 

    self.css('background', 'red'); 
}).dblclick(function() 
{ 
    var self = $(this); 
    var box = self.parents('.box'); 

    self.css('background', 'green'); 
}); 

しかし、もしそうなら、どうすればいいですか？

Answer 1

、彼らはthisは、それが置かれている場所に応じて異なる値を持つ特殊なキーワードであるので、あなたが後にしているものは含まれません。あなたの例では、各関数ではなく、グローバルスコープで一度評価されます。

つまり、説明したグローバル変数は良い考えではありません。

$('#title').click(function() 
{ 
    $(this).css('background', 'red').parents('box').slideDown('slow'); 
}).dblclick(function() 
{ 
    $(this).css('background', 'green').parents('box').slideUp('slow'); 
}); 

Answer 2

あなたがやろうとしているものを行うことはできませんが、あなたはこのような何かを行うことができます：@ box9は言及

あなたは可能性が

function getBoxes(selector) { 
    return $(selector).parents('.box'); 
} 

$('#title').click(function() 
{ 
    getBoxes(this).css('background', 'red'); 
}).dblclick(function() 
{ 
    getBoxes(this).css('background', 'green'); 
}); 

、として、ちょうど一緒にあなたの呼び出しをチェーン。これが本質的なことです。上記の関数を変更して、色の変更を処理することもできます。特にこれが唯一のものである場合は、色の変更を処理することができます。グローバル変数にアクセスすることができますが

function colorBoxes(selector, color) { 
    $(selector).parents('.box').css('background', color); 
} 

$('#title').click(function() 
{ 
    colorBoxes(this, 'red'); 
}).dblclick(function() 
{ 
    colorBoxes(this, 'green'); 
}); 

Answer 3

ことが可能です：

var titleEl = $('#title'); 
var boxEl = titleEl.parents('.box'); 

titleEl.click(function() 
{ 
    titleEl.css('background', 'red'); 
    boxEl.slideDown('slow'); 
}).dblclick(function() 
{ 
    titleEl.css('background', 'green'); 
    boxEl.slideUp('slow'); 
}); 

グローバル変数は通常であるため、それは、IMO悪いアイデアだが、その代わりに、チェーン、コードself変数がすべてで作成する必要はありませんようにすることができます悪いアイデア、特に彼らが簡単に使用されているときに。

あなたの$（ '＃title'）がidではなく、したがって単一の要素だが多分$（ 'title'）のクラスと多くの要素であったなら、 titleEl.css（）への各参照はクラスのすべてのインスタンスを変更するためです）。これはグローバル変数モデルが脆弱であることを示している。

割り当てが1回だけ行われるため、DOM要素を動的に追加することもできません。