GUJ Discussões   :   últimos tópicos   |   categorias   |   GUJ Respostas

Retorno de um evento onclick

Tags: #<Tag:0x00007fa0039e7640> #<Tag:0x00007fa0039e74d8>

Estou tendo uma dificuldade no meu código, mesmo acreditando que parece simples.

Coloquei um alert na função apenas para teste. Mas o retorno é apenas do último nome do produto…e não dá linha clicada…alguém poderia dar uma ajuda ?
Desde então agradecido.

<script>
  function fazGet(url) {
    let request = new XMLHttpRequest();
    request.open("GET", url, false);
    request.send();
    return request.responseText;
  }
  
  data =fazGet("https://s3.us-west-2.amazonaws.com/secure.notion-static.com/11b895d0-bc64-4f3a-bfa9-7c652be8d415/acima-10-reais.json?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAT73L2G45O3KS52Y5%2F20210928%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20210928T155107Z&X-Amz-Expires=86400&X-Amz-Signature=8df20b1a517b09b06993ec61aa6acb15a6764143adfc964dbf9929f4cdf65597&X-Amz-SignedHeaders=host&response-content-disposition=filename%20%3D%22acima-10-reais.json%22");
  produtos = JSON.parse(data);
  
  for (i = 0; i <= 6; i++) {
    for (var produto in produtos) {
      imgProd = JSON.stringify(produtos['items'][i]['imageUrl']).replace('"', "  ");
      nomeProd = JSON.stringify(produtos['items'][i]['name']).replace('"', "  ");
      precoProd = JSON.stringify(produtos['items'][i]['price']).replace('"', " ");
    }

    var linha = document.createElement("button");
    var itemDescNome = document.createElement("li");
    var itemDescPreco = document.createElement("li");
    var img = document.createElement("img");
    img.setAttribute("src", imgProd);
    linha.appendChild(img);
    
    var nome = document.createTextNode(nomeProd);
    var preco = document.createTextNode("R$ "+(precoProd/100).toFixed(2));
    itemDescNome.appendChild(nome);
    itemDescNome.setAttribute("class", "descProd");
    itemDescPreco.appendChild(preco);
    itemDescPreco.setAttribute("class", "descProd");
    
    linha.appendChild(itemDescNome);
    linha.appendChild(itemDescPreco);
    document.getElementById("tela").appendChild(linha).classList.add("list-group-item","list-group-item-action");
    linha.onclick = function() { alert(nomeProd)};
    console.log(nomeProd);
  }
  
  var total = 0;
  document.getElementById("total").innerHTML= "R$ "+total;
</script>
```Texto pré-formatado

Mostra seu código aqui

identar texto pré-formatado por 4 espaços
//