Ámbito de la variable en el atributo onclick con Javascript

Question

Estoy usando Prototype y tratando de acceder dinámicamente una variable en un bucle.

Código habla mejor que yo:

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

El problema es que "no se define" al hacer clic en cualquiera de los botones de Cancelar.

¿Cómo cambio el alcance variable, de forma que "i" mantiene el valor apropiado para cada botón? No estoy interesado en cualquiera arroud trabajo.

Answer 1

Creo que estaban poniendo i a la citada cadena en lugar de parent por lo que era en el nivel equivocado de alcance (conceptualmente hablando).

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

Answer 2

Puede hacerlo de esta manera -

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

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

se representará como esto -

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

y así sucesivamente.

Answer 3

que no es necesario que la variable i. Si desea eliminar los padres de esa entrada, hacer:

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

o si realmente desea, puede:

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