• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
    • Questions
    • Teachers
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

242
Views
Elementos de entrada que tienen el mismo valor con el bucle 'for'

Acabo de experimentar con JavaScript y estaba probando este código.

 var elements = document.getElementsByTagName("p"); var n = elements.length; // Should be: 10 for (var i = 0; i < n; i++) { elements[i].onclick = function () { console.log("This is element #" + i); }; }
 <p>Element: #1</p> <p>Element: #2</p> <p>Element: #3</p> <p>Element: #4</p> <p>Element: #5</p>

Sin embargo, cuando se ejecuta el código, ocurre algo extraño. Básicamente, por ejemplo, si hace clic en el elemento #1, dirá que ha hecho clic en el elemento #5.


Esto es lo que tengo curiosidad por saber:

  1. ¿Por qué ocurre esto?
  2. ¿Hay una solución para esto?
almost 3 years ago · Juan Pablo Isaza
2 answers
Answer question

0

cambio de var para dejar:

 for (let i = 0; i < n; i++) { elements[i].onclick = function () { console.log("This is element #" + i); }; }
almost 3 years ago · Juan Pablo Isaza Report

0

Puede utilizar el siguiente código para corregir los problemas.

 var elements = document.getElementsByTagName("p"); var n = elements.length; function makeHandler(num) { return function() { console.log("This is element #" + num); }; }; for (var i = 0; i < n; i++) { elements[i].onclick = makeHandler(i + 1); }

Expliquemos el código.


Básicamente, en este código, makeHandler se ejecuta inmediatamente cada vez que pasamos por el ciclo, cada vez que recibe el valor actual de i + 1 y lo vincula a una variable num con ámbito.

La función externa ( makeHandler ) devuelve la función interna (función anónima) (que también usa esta variable num con ámbito) y el onclick del elemento se establece en esa función interna.

Esto asegura que cada onclick reciba y use el valor i adecuado (por la variable num de alcance).

almost 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error