Tengo un div de producto que contiene el atributo data-product , su valor es objeto. Y quiero poner los datos del producto en gtag.
pero ¿por qué cuando hago cada uno, solo hay 1 dato? y cuando quiero acceder a data.id y data.name , ¿por qué no está definido?
$(document).ready(function(){ const promotions = [] $(".product-item").each(function(){ const data = $(this).data('product'); promotions.push({ "id": data.id, "name": data.name }) }) //gtag('event', 'view_promotion', { //promotions //}); $('.product-item').each(function(){ $(this).on("click", function(e){ const data = $(this).data('product') console.log(data) }) }) }) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="product-item" data-product='{"id" : 123, "name" : "Product 1"}'> Product 1 </div> <div class="product-item" data-product='{"id" : 124, "name" : "Product 2"}'> Product 2 </div> <div class="product-item" data-product='{"id" : 125, "name" : "Product 3"}'> Product 3 </div>Cambia tu código HTML, funciona para mí:
<div class="product-item" data-product='{"id":124,"name":"Product 1"}'> Product 1 </div> <div class="product-item" data-product='{"id":125,"name":"Product 2"}'> Product 2 </div> <div class="product-item" data-product='{"id":126,"name":"Product 3"}'> Product 3 </div>Según la API , el valor del atributo debe ser un JSON válido, incluidos los nombres de propiedad entrecomillados.
En su caso, no está formateado correctamente como JSON, por lo tanto, no funciona. Formatee su data-product como JSON válido.
Una vez que se corrige el JSON, para repetir las promociones
$(document).ready(function(){ let promotions = [] $(".product-item").each(function(){ const data = $(this).data('product'); promotions.push({ "id": data.id, "name": data.name }) }) gtag('event', 'view_promotion', { promotions }); })