Bildaustausch bei Attributsauswahl

[noRiddle (revilonetz)]

• Was bitte ist daran jetzt formatiert ?
• Dachtest du formatieren löst dein Problem ?
• Ich habe dir den entscheidenden Hinweis bereits gegeben.
  Den zu ignorieren und einfach deinen Code nochmals zu posten lässt nicht auf Eigeninitiative schließen.

Gruß,
noRiddle

[Nice_Stuff]

Ich habe den Code unter Notepad++ sauber eingerückt, ich weiß nicht warum das hier jetzt so aussieht, das soll keine Absicht sein!!!

[Nice_Stuff]

Ich habe jetzt noch mal das wichtigste zusammengefasst. Ich will hier mit Sicherheit kein Ignorant sein

Ich hoffe der Code ist jetzt besser ersichtlich...

Code: Javascript  [Auswählen]

<script type="text/javascript">
  function imgError(img)
  {literal}{{/literal}
      img.onerror = "";
      img.src = "images/product_images/product_options/noimage_0.jpg";
      document.getElementById('box_{$options_data.ID}').href = ('images/product_images/product_options/noimage_0.jpg');
  {literal}}{/literal}
</script>
 

Code: XML  [Auswählen]

{foreach key=key_data item=item_data from=$options_data.DATA}
<a href="images/product_images/product_options/{$item_data.ID}_0.jpg" class="thickbox" id="box_{$options_data.ID}">
<img src="images/product_images/product_options/{$item_data.ID}_0.jpg" onError="imgError(this);" height="80px" id="img_{$options_data.ID}" />
</a>   
{php}

[Nice_Stuff]

Hab jetzt mal eine andere Variante versucht, da ich mit dem href auf dem Bild nicht weiter komme:

Code: Javascript  [Auswählen]

    <script type="text/javascript">
    function imgError(img)
    {literal}{{/literal}
                   
     img.onerror = "";
     img.src = "http://www.php.de/images/product_images/product_options/noimage_0.jpg";
                                                                   
      var id='box_{$options_data.ID}';
      var myClassName=" thickbox";
      var d;
      d=document.getElementById(id);
      d.className=d.className.replace(myClassName,"");
     
     
       img.parentNode.onclick=function()
        {literal}{{/literal}                                                                      
         return(false);
        {literal}}{/literal}
                                           
    {literal}}{/literal}
    </script>

Code: XML  [Auswählen]

    {php}$c = 0;{/php}
    {foreach key=key_data item=item_data from=$options_data.DATA}
      <a href="http://www.php.de/images/product_images/product_options/{$item_data.ID}_0.jpg" class="thickbox" id="box_{$options_data.ID}">
        <img src="http://www.php.de/images/product_images/product_options/{$item_data.ID}_0.jpg" onError="imgError(this);" height="80px" id="img_{$options_data.ID}" />
      </a>
    {php}
    $c++;
    if ( $c >= 1) break;{/php}

Bildtausch und Link deaktivieren funktioniert schon mal, nun muss ich nur noch die Class entfernen, damit die thickbox nicht ausgelöst wird. Aber da will es nicht funktionieren. Die ID wird einwandfrei im Script zugeordnet, aber die thickbox ist immer noch aktiv...

[Tomcraft]

Ich habe jetzt mal beide Themen, in denen du geschrieben hast, zusammengeführt und überflüssige oder doppelte Beiträge gelöscht.

Grüße

Torsten

[noRiddle (revilonetz)]

@Nice_Stuff
Du sprichst mit deinem Code

Code: Javascript  [Auswählen]

d.className=d.className.replace(myClassName,"");

ja das Bild, sprich, den img-tag an, nicht den a-tag welcher ja die Klasse thickbox hat (Stichwort: parentNode).

Warum machst du das eigtl. nicht mit jQuery, das ist doch ohnehin implementiert.
Da wäre es mit removeClass() ganz einfach und du bräuchtest auch kein document.getElementById() weil es schlicht mit $(#ID) geht.

Gruß,
noRiddle

[Nice_Stuff]

Vielen Dank Thorsten!

Ja, das leuchtet mir ein, dass er den a-tag nicht anspricht!

Code: Javascript  [Auswählen]

<script type="text/javascript">
function imgError(img)
        {                              
                img.onerror = "";
                img.src = "images/product_images/product_options/noimage_0.jpg";
                               
                $("a#box_{$options_data.ID}").removeClass("thickbox");

                img.parentNode.onclick=function()
                {                                                                      
                return(false);
                }                                      
        }
</script>

Irgendwie trifft er den a-tag immer noch nicht...

[Nice_Stuff]

Ich habe mich noch mal internsiv damit beschäftigt, aber so langsam bin ich mit meinem Latain am Ende. Die Funktion geht soweit, bis auf die "thickbox". Nehme ich diese im html-Bereich raus funktioniert alles einwandfrei. Aber ich benötige diese ja für die erkannten Bilder.

Mit jQuery geht das schon mal prima, nur die Funktion removeClass() will sich mir nicht erschließen.

Hier noch mal der Code:

Code: Javascript  [Auswählen]

<script type="text/javascript">
<!--
function bild_wechsel{$options_data.ID}(select)
{literal}{{/literal}
         document.getElementById('box_{$options_data.ID}').href = ('images/product_images/product_options/' + select.options[select.options.selectedIndex].value + '_0.jpg' );
         document.getElementById('img_{$options_data.ID}').src = ('images/product_images/product_options/' + select.options[select.options.selectedIndex].value + '_0.jpg' );
         return true;
{literal}}{/literal}   

        function imgError(img)
        {literal}{{/literal}
       
                img.onerror = "";
                img.src = "images/product_images/product_options/noimage_0.jpg";
               
                        $('#box_{$options_data.ID}').click(function(e)
                        {literal}{{/literal}
                                e.preventDefault();
                        {literal}}{/literal}
                        );
               
                                $(document).ready(function()
                                {literal}{{/literal}
                                        $('#box_{$options_data.ID}').removeClass('thickbox');
                                {literal}}{/literal}
                                );
                               
        {literal}}{/literal}   
// -->
</script>

Installiert ist die Thickbox 3.1.

Vielleicht ist jemand so freundlich und würde mir das mit der removeClass in diesem Zusammenhang nochmal erklären. Thanks