jQuery .onイベントが変数セレクタで動作しない

Question

動的にロードされる要素に対してon Click機能を作成する必要があります。この要素のIDは変数$elementです。 IDは文字列で保存されます。私はこのような.onイベントハンドラに渡し：

... .on("click", '"'+$element+'"', function() { ... 

それは（Case 1 JSFiddleを参照）が動作し、エラーUncaught Error: Syntax error, unrecognized expression: "#2"を与えていません。 #2は要素のIDです。

... .on("click", function() {'"'+$element+'"'}, function() { ... 

しかし、（ Case 2 JSFiddleを参照）クリッカブル要素に全体のDOMを回すようだ：

は、その後、私はこのような関数でラップしようとしました。なぜ...？

最後に、Case 3 JSFiddleはID #2の要素をクリックすると何かが発生し、ID #3の要素をクリックすると何も起こりません。何も起こりません。私はセレクタが変数として渡されたときに動作するようにはできません。

---

Case 1 JSFiddleは奇妙なエラーを出します。

Case 2 JSFiddle「a」または「b」をクリックすると「a」が赤色に変わります。

Case 3 JSFiddleは私が後にしているものです。 "a"をクリックすると、赤色に変わり、 "b"をクリックすると何も起こりません。あなたのフィドルから

Answer 1

、have a look at this：

var $element = '#a2'; 

$("#a1").on(
     "click", 
     $element,  // <-- child Selector 
     function() { 
      $("#a1") 
      .find('span') 
      .filter(function() { 
       return $(this).text() === 'a'; 
      }) 
      .css('background-color', 'red'); 
     } 
    ); 

IDがが番号、at least in 4 timesで始めるべきではないことに注意してください。