une erreur de « cette »

Question

var orders=document.getElementsByClassName("order"); 
for(var i=0;i<orders.length;i++){ 
    orders[i].index=i; 
    orders[i].onclick=function(){ 
     console.log(orders[i].index); 
    } 
} 

l'erreur comme ceci: enter image description here

Mais quand je change le code comme ceci:

var orders=document.getElementsByClassName("order"); 
    for(var i=0;i<orders.length;i++){ 
     orders[i].index=i; 
     orders[i].onclick=function(){ 
      console.log(this.index); 
     } 
    } 

L'erreur a disparu, et ce que je suis confus au sujet est que ce == commandes [i] comme nous le savons, mais pourquoi quand j'utilise des commandes [i] .index, il se trompe?

Answer 1

$(document).on('click', '.order', function() { 
 
     console.log($(".order").index(this)); 
 
});

<div class="order ">product info</div> 
 
<div class="order">product info</div> 
 
<div class="order">product info</div> 
 
<div class="order">product info</div> 
 
<div class="order">product info</div>