jQueryの `this`スコープの問題

Question

私は1つの場所で定義されたグローバル関数があります：私はインラインonClickイベントでHTML要素の内側にそれを呼びたい、そして、

function addToCart(){ 
    var prodText = $(this).parent().siblings(".item1").text(); 
    $("#"+prodId+"shopC").children(".item1").text(prodText); 
    alert(prodText); 
} 

を： onClick='addToCart()「

機能していませんが、機能コードをonClickイベントの内部に直接入れると機能しますので、thisスコープの問題でなければなりません。 thisの範囲に関する多くの質問/説明がありますが、私はこの特定のケースについて簡単な答えを忘れています（私は"use strict"を成功させようとしました）。 この作品を作成するには？

Answer 1

現在の実装では、thisは関数を呼び出した要素を参照していません。これはwindowオブジェクトを指します。

あなたは

onClick='addToCart(this)' 

として機能する現在の要素のコンテキスト、すなわちthisを通過し、パラメータとして要素を受け入れるように関数を変更する必要があります。

function addToCart (elem){ 
    var prodText = $(elem).parent().siblings(".item1").text(); 
    $("#"+prodId+"shopC").children(".item1").text(prodText); 
    alert(prodText); 
} 

Answer 2

基本的this普通関数内windowを指します。文脈thisをインラインハンドラonClick='addToCart(this)'に渡す必要があります。それを受け取り、以下のようなイベントハンドラの中で使用してください。

function addToCart (_this){ 
    var prodText = $(_this).parent().siblings(".item1").text(); 

Answer 3

あなたは、あなたがonClick機能を追加したオブジェクトを指していない、その要素をあなたの機能で

onClick='addToCart(this)' 

Answer 4

thisオブジェクトをキャプチャすることができますが、インラインaddToCart関数を呼び出し、このキーワードを渡す必要がありに。むしろwindowオブジェクトを指しています。

thisをパラメータとして関数に渡す必要があります。あなたのonClickで

function addToCart (trigger) { // Code goes here } 

と呼んaddToCart(this)。

thisの詳細については、こちらのjavascriptをご覧ください。