JavaScript onerror funktioniert nicht in Shopify Liquid Skript

Question

Ich habe ein Skript erstellt, das durch alle Tags in einer Sammlung führt und eine Unterkategorie div mit einem Bild + h3 Titel der Unterkategorie/Tag anzeigt.

Das Bild, das ich in meinem Thema zu den Assets Ordner hochladen und ich konstruierte eine URL des Vermögens Ordner/Sammlung Griff/Tag Griff + .png

Das Problem ist, dass ich einige Tags, die ich nicht tun Ich möchte als eine Unterkategorie anzeigen, also überprüfe ich, ob es ein Fehler beim Laden des Bildes gibt und wenn ja, verberge ich das Bild mit dem Titel/h3-Tag, aber das JavaScript funktioniert einfach nicht.

Irgendeine Idee, wie man das repariert ???

{% unless current_tags %} 
     {% capture col_url%}{% if collection.url.size == 0 %}/collections/all{%else%}{{collection.url}}{%endif%}{%endcapture%} 
     {% if collection.all_tags.size > 0 %} 
     <div class="grid text-center"> 
      {% for tag in collection.all_tags %} 
       {% capture file_name %}{{ collection.handle }}-{{ tag | handle }}.png{% endcapture %} 
       {% capture alt_attr %}{{ collection.title | escape }}-{{tag | handle}}{% endcapture %} 
       <div class="grid-item large--one-eighth medium--one-third" id="{{ collection.handle }}-{{ tag | handle }}-div"> 
       <a href="{{col_url}}/{{tag | handle}}"> 
        <img src="{{ file_name | asset_url }}" alt="{{ alt_attr }}" id="{{ collection.handle }}-{{ tag | handle }}-img"> 
       </a> 
        <h3 id="{{ collection.handle }}-{{ tag | handle }}-h3">{{ tag | link_to_tag: tag }}</h3> 
       </div> 
      <script> 
      document.getElementById("{{ collection.handle }}-{{ tag | handle }}-img").onerror = function(){ 
       document.getElementById("{{ collection.handle }}-{{ tag | handle }}-h3").style.display = "none"; 
       document.getElementById("{{ collection.handle }}-{{ tag | handle }}-img").style.display = "none"; 
      }     
      </script> 
      {% endfor %} 
     </div> 
     {% endif %} 
{% endunless %} 

Answer 1

ich es onerror Attribut in dem Bild, das durch das Schreiben der JavaScript festgelegt, hier ist mein Code:

<img src="{{ file_name | asset_url }}" alt="{{ alt_attr }}" id="{{ collection.handle }}-{{ tag | handle }}-img" onerror="this.onerror = null;this.parentElement.parentElement.style.display = 'none'"> 

Aber ich werde immer noch herauszufinden, wie, was das Problem in erster Linie war.