Django Galerie mit jquery

Question

Ich möchte Bildergalerie erstellen. Ich habe nur miniatur ohne bigImage Ich weiß nicht was ich falsch mache.

{% extends "shop/base.html" %} 
{% load static %} 

{% block title %}{{ product.name }}{% endblock %} 
{% block content %} 
<script language="JavaScript" type="text/javascript"> 
    $(document).ready(function() { 
     $('#ImageGallery img').click(function() { 
      var bigImagePath = '{{image.image.url}}' + $(this).attr('alt'); 
      $('#bigImage').attr('src', bigImagePath); 
     }) 

    }) 
</script> 

<div id="ImageGallery"> 
    {% for image in images %} 
     <img src="{{image.image_url}}" alt="test" style="width: 100px; cursor: pointer;"> 

    <div> 
     <img id="bigImage" alt=""> 
    </div> 
    {% endfor %} 
</div> 

{% endblock %} 

ImageGallery wird ohne BigImage vor Ort angezeigt. Ich denke, mein Fehler ist auf jq

Answer 1

Ich denke, Ihr Fehler ist nicht in jQuery aber über was Ihr Kontext ist, um diese HTML zu rendern.

Da ImageGallery korrekt gerendert wird (wie Sie sagen), ist dies, weil {{ image }} aus der for Schleife übernommen wird. Aber auf der Linie: var bigImagePath = '{{image.image.url}}' + $(this).attr('alt'); existiert die {{ image.image.url }} Variable? Beachten Sie, dass es außerhalb der for Schleife ist.