JavaScriptを使用したonclick属性の可変スコープ

Question

私はPrototypeを使用しており、ループ内の変数に動的にアクセスしようとしています。

コードは、私よりも話す：

for (var i=0;i<5;i++) { 
    $('parent' + i).insert('<input type="button" value="Cancel" onclick="$('parent' + i).remove()" />', {position: 'after'}); 
} 

問題は、私はキャンセルボタンのいずれかをクリックすると、「私が定義されていない」ということです。

"i"が各ボタンの適切な値を保持するように変数スコープを変更するにはどうすればよいですか？ 私は仕事場には興味がありません。あなたはこのようにそれを行うことができます

Answer 1

parentではなく、引用された文字列にiを入れていたので、間違った範囲のスコープ（概念的に言えば）にあったと思います。

for (var i=0;i<5;i++) 
{ 
    $('parent' + i).insert(
     '<input type="button" value="Cancel" onclick="$(\'parent' + i + 
     '\').remove()" />', {position: 'after'}); 
} 

Answer 2

- ように

<input type="button" value="Cancel" onclick="$('parent1').remove()" /> 
<input type="button" value="Cancel" onclick="$('parent2').remove()" /> 
<input type="button" value="Cancel" onclick="$('parent3').remove()" /> 
... 

と -

for (var i = 0; i < 5; i++) { 

    $('parent' + i).insert('<input type="button" value="Cancel" onclick="$(\'parent' + i + '\').remove()" />', {position: 'after'}); 
} 

をそれはこのようにレンダリングされます。

Answer 3

この変数は必要ありません。

<input type="button" value="Cancel" onclick="this.parentNode.parentNode.removeChild(this.parentNode)" /> 

をかあなたが本当に本当にしたい場合は、以下のことができます：あなたがその入力の親を削除したい場合は、行う

for (var i=0;i<5;i++) { 
    $('parent' + i).insert('<input type="button" value="Cancel" onclick="$(\'parent' + i + '\').remove()" />', {position: 'after'}); 
}