Javascript Fehler

tokyopunk

Hola,

um meine Flickr-Bilder im Zufallsmodus anzeigen zu lassen, habe ich mir aus diversen Quellen eine Javascript-Funktion zusammen geklöppelt:

Code

<script type="text/javascript"><!--
      var sets = ["72157606397817297", "72157606338263681", "72157606312570417", "72157606293528995", "72157606290402222", "72157606290181614", "72157606293110671", "72157606293099509", "72157606289930102", "72157606292587731", "72157606289587842", "72157606289576394", "72157606289551204", "72157606292301839", "72157606292275147", "72157606289276782", "72157606292210057", "72157606289211792", "72157606292153925", "72157606291845023", "72157606291787745", "72157606288652612", "72157606288482698", "72157606291474227", "72157606291437731", "72157606291362423", "72157606288165530", "72157606287982248", "72157606290927911", "72157606290835709", "72157606010361258", "72157605797205791", "72157605771547422", "72157605624254126", "72157605338298155", "72157604976723560", "72157604295153386", "72157604054371851", "72157603570977520", "72157603499255775", "72157603495361660", "72157603489406486"];
var user = "87869284@N00";


      function showBadge(){
      var rand1 = Math.floor(sets.length*Math.random())
      var rand2 = Math.floor(sets.length*Math.random())
      var rand3 = Math.floor(sets.length*Math.random())
      var rand4 = Math.floor(sets.length*Math.random())
      var rand5 = Math.floor(sets.length*Math.random())
      var rand6 = Math.floor(sets.length*Math.random())
      
      document.write("<script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand1]+"&amp;context=in%2Fset-"+sets[rand1]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand2]+"&amp;context=in%2Fset-"+sets[rand2]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand3]+"&amp;context=in%2Fset-"+sets[rand3]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand4]+"&amp;context=in%2Fset-"+sets[rand4]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand5]+"&amp;context=in%2Fset-"+sets[rand5]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand6]+"&amp;context=in%2Fset-"+sets[rand6]+"%2F\"></script>");
      }      // --!></script>

Alles anzeigen

Leider sehen einige meiner Nutzer (meist mit Windows Vista und Firefox 2) folgenden Fehlercode oben im Header:

Code

"); } // --!&gt;

Ich bin nicht der größte Javascripter der Welt, könnte mir mal jemand sagen, wo hier die Fehlerquelle liegt?

Mein Blog ist hier zu finden: AMY & PINK

Danke, Marcel

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

codestyling

Script im Script geht auch nicht!

Code

<script type="text/javascript"><!--
      var sets = ["72157606397817297", "72157606338263681", "72157606312570417", "72157606293528995", "72157606290402222", "72157606290181614", "72157606293110671", "72157606293099509", "72157606289930102", "72157606292587731", "72157606289587842", "72157606289576394", "72157606289551204", "72157606292301839", "72157606292275147", "72157606289276782", "72157606292210057", "72157606289211792", "72157606292153925", "72157606291845023", "72157606291787745", "72157606288652612", "72157606288482698", "72157606291474227", "72157606291437731", "72157606291362423", "72157606288165530", "72157606287982248", "72157606290927911", "72157606290835709", "72157606010361258", "72157605797205791", "72157605771547422", "72157605624254126", "72157605338298155", "72157604976723560", "72157604295153386", "72157604054371851", "72157603570977520", "72157603499255775", "72157603495361660", "72157603489406486"];
var user = "87869284@N00";


      function showBadge(){
      var rand1 = Math.floor(sets.length*Math.random())
      var rand2 = Math.floor(sets.length*Math.random())
      var rand3 = Math.floor(sets.length*Math.random())
      var rand4 = Math.floor(sets.length*Math.random())
      var rand5 = Math.floor(sets.length*Math.random())
      var rand6 = Math.floor(sets.length*Math.random())
      
      document.write("[B]<script[/B] type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand1]+"&amp;context=in%2Fset-"+sets[rand1]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand2]+"&amp;context=in%2Fset-"+sets[rand2]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand3]+"&amp;context=in%2Fset-"+sets[rand3]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand4]+"&amp;context=in%2Fset-"+sets[rand4]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand5]+"&amp;context=in%2Fset-"+sets[rand5]+"%2F\"></script><script type=\"text/javascript\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand6]+"&amp;context=in%2Fset-"+sets[rand6]+"%2F\"></script>");
      }      // --!></script>

Alles anzeigen

Sollte so sein ([COLOR=Blue]und zwar alle, die im write() vorkommen, nur nochmal als Ergänzung.[/COLOR]):

Code

document.write("[B]<scr"+"ipt[/B] type=\"text/javascript\" src=\" ...

sonst interpretieren das einige Browser.

tokyopunk

Ok, vielen vielen Dank. Hab es gleich ausprobiert und es scheint zu funktionieren. Weder bei mir, noch bei getesteten Browsern bei Browsershots.org erscheint die Fehlermeldung. Ich hoffe es gibt keinen der mir das Gegenteil bestätigen kann ;)

Nochmals danke.

tokyopunk

Also hab jetzt durch einen Leser gehört, dass es mein Layout im Opera total zerfetzt, was stimmt denn mit dem Code nicht?

Code

<script type="text/javascript"><!--
      var sets = ["72157606397817297", "72157606338263681", "72157606312570417", "72157606293528995", "72157606290402222", "72157606290181614", "72157606293110671", "72157606293099509", "72157606289930102", "72157606292587731", "72157606289587842", "72157606289576394", "72157606289551204", "72157606292301839", "72157606292275147", "72157606289276782", "72157606292210057", "72157606289211792", "72157606292153925", "72157606291845023", "72157606291787745", "72157606288652612", "72157606288482698", "72157606291474227", "72157606291437731", "72157606291362423", "72157606288165530", "72157606287982248", "72157606290927911", "72157606290835709", "72157606010361258", "72157605797205791", "72157605771547422", "72157605624254126", "72157605338298155", "72157604976723560", "72157604295153386", "72157604054371851", "72157603570977520", "72157603499255775", "72157603495361660", "72157603489406486"];
var user = "87869284@N00";


      function showBadge(){
      var rand1 = Math.floor(sets.length*Math.random())
      var rand2 = Math.floor(sets.length*Math.random())
      var rand3 = Math.floor(sets.length*Math.random())
      var rand4 = Math.floor(sets.length*Math.random())
      var rand5 = Math.floor(sets.length*Math.random())
      var rand6 = Math.floor(sets.length*Math.random())
      
      document.write("<scr"+"ipt type=\"text/javascr"+"ipt\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand1]+"&amp;context=in%2Fset-"+sets[rand1]+"%2F\"></scr"+"ipt><scr"+"ipt type=\"text/javascr"+"ipt\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand2]+"&amp;context=in%2Fset-"+sets[rand2]+"%2F\"></scr"+"ipt><scr"+"ipt type=\"text/javascr"+"ipt\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand3]+"&amp;context=in%2Fset-"+sets[rand3]+"%2F\"></scr"+"ipt><scr"+"ipt type=\"text/javascr"+"ipt\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand4]+"&amp;context=in%2Fset-"+sets[rand4]+"%2F\"></scr"+"ipt><scr"+"ipt type=\"text/javascr"+"ipt\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand5]+"&amp;context=in%2Fset-"+sets[rand5]+"%2F\"></scr"+"ipt><scr"+"ipt type=\"text/javascr"+"ipt\" src=\"http://www.flickr.com/badge_code_v2.gne?count=1&amp;display=random&amp;size=s&amp;source=user_set&amp;user="+user+"&amp;set="+sets[rand6]+"&amp;context=in%2Fset-"+sets[rand6]+"%2F\"></scr"+"ipt>");
      }      // --!></script>

Alles anzeigen

codestyling

Da du es abgeschalten hast, Flickr Bilder zu zeigen, kann man nicht viel dazu sagen. Aber es wird nicht das Script selbst sein sondern eine unpassende CSS Formatierung dafür. Kannst du einen Link bereitstellen, wo man das live mit Opera sehen kann ?

tokyopunk

Also ein Bild davon ist hier zu finden. Wenn ich den oberen Code rausnehme, schnurrt Opera wie ein Kätzchen, sobald ich ihn einfüge, zerfleischt er mein Layout.

Eigentlich will ich nur, dass wirklich zufällige Bilder aus meinen gesamten Flickr-Album angezeigt werden, da der normale Flickr-Badge-Code nur die letzten Alben berücksichtigt.

codestyling

Dann klebt doch hier mal einen dieser Scriptlinks ein, damit man sieht, was Flickr liefert. Wenn die bei Flickr ihrerseits fehlerhafte Scripts ausliefern, dann kannst du dich auf den Kopf stellen.

tokyopunk

Also Flickr selbst gibt nur diesen Code aus:

Code

<div id="flickr_badge_uber_wrapper"><a href="http://www.flickr.com" id="flickr_www">www.<strong style="color:#3993ff">flick<span style="color:#ff1c92">r</span></strong>.com</a><div id="flickr_badge_wrapper">
<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=10&display=random&size=s&layout=x&source=user&user=87869284%40N00"></script>
</div></div>

Das wäre ja gut und schön, wenn er auch wie versprochen wirklich ALLE Fotos berücksichtigen würde, tut er aber nicht, sondern gibt nur zufällige der zuletzt hochgeladenen Alben aus.. Also wollte ich mit meinem Code, dass er aus allen angegeben Alben immer eins rauszieht und anzeigt.

codestyling

Also Flickr antworted auf die Scriptanfrage mit folgenden Script:

Code

var b_txt = '';


// write the badge
    
    
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image1"><a href="http://www.flickr.com/photos/tokyopunk/2688136423/"><img src="http://farm4.static.flickr.com/3223/2688136423_38fe072efa_s.jpg" alt="Ein Foto in Flickr" title="Sabse und Eniz" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image2"><a href="http://www.flickr.com/photos/tokyopunk/2688826168/"><img src="http://farm4.static.flickr.com/3042/2688826168_a41db5674c_s.jpg" alt="Ein Foto in Flickr" title="16" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image3"><a href="http://www.flickr.com/photos/tokyopunk/2688949108/"><img src="http://farm4.static.flickr.com/3154/2688949108_773b961529_s.jpg" alt="Ein Foto in Flickr" title="Die MÃ¤dels" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image4"><a href="http://www.flickr.com/photos/tokyopunk/2688925418/"><img src="http://farm3.static.flickr.com/2303/2688925418_2d62e9c807_s.jpg" alt="Ein Foto in Flickr" title="Ira" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image5"><a href="http://www.flickr.com/photos/tokyopunk/2688847478/"><img src="http://farm4.static.flickr.com/3003/2688847478_fa7f639c57_s.jpg" alt="Ein Foto in Flickr" title="Ramo 101" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image6"><a href="http://www.flickr.com/photos/tokyopunk/2688137655/"><img src="http://farm4.static.flickr.com/3092/2688137655_1a9699719b_s.jpg" alt="Ein Foto in Flickr" title="Bibi und Betty" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image7"><a href="http://www.flickr.com/photos/tokyopunk/2688195831/"><img src="http://farm4.static.flickr.com/3073/2688195831_66e6dd3807_s.jpg" alt="Ein Foto in Flickr" title="Kalli und ich" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image8"><a href="http://www.flickr.com/photos/tokyopunk/2705695419/"><img src="http://farm4.static.flickr.com/3075/2705695419_340f4967d7_s.jpg" alt="Ein Foto in Flickr" title="Anni" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image9"><a href="http://www.flickr.com/photos/tokyopunk/2688949638/"><img src="http://farm4.static.flickr.com/3058/2688949638_74fcaf91ec_s.jpg" alt="Ein Foto in Flickr" title="Kathi, Kerstin und Tina" height="75" width="75"></a></div>';
        
                  
            b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image10"><a href="http://www.flickr.com/photos/tokyopunk/2689007496/"><img src="http://farm4.static.flickr.com/3264/2689007496_35689f6603_s.jpg" alt="Ein Foto in Flickr" title="Cela und ich" height="75" width="75"></a></div>';
    
document.write(b_txt)
//document.write(b_txt.split('<').join('&lt;'))

Alles anzeigen

Dieses erzeugt eine Menge mehr <div> an Ort und Stelle mit den Bildern drin. Da du aber keinen Container um dein Script hast, kann es sein, das alle diese Divs dann "wegfloaten".
Nicht umsonst haben die ein Container drum:

Code

[COLOR=Red]<div id="flickr_badge_uber_wrapper"><a href="http://www.flickr.com" id="flickr_www">www.<strong style="color:#3993ff">flick<span style="color:#ff1c92">r</span></strong>.com</a><div id="flickr_badge_wrapper">[/COLOR]
<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=10&display=random&size=s&layout=x&source=user&user=87869284%40N00"></script>
[COLOR=Red] </div></div>[/COLOR]

Bau selbst mal einen Container Div drum, den du dann stylest.

tokyopunk

Hm, aber ich habe doch bereits einen DIV um mein Script:

Code

<div id='flickr_badge_wrapper' style='margin-top:10px;'><script type='text/javascript'>showBadge();</script></div>

Muss das nicht reichen?

codestyling

Die haben ja auch 2 div angegeben. Haben die auch eine Stylesheet zum includen angeben ? Dann wären vermutlich die 2 divs auch nötig.

tokyopunk

Ok habs gemacht, hat aber leider keinen positiven Effekt gehabt.

Ist der Code an sich denn so in Ordnung oder versteckt sich da vielleicht der Fehler?

tokyopunk

Hm, ok an dem Code scheint's nicht zu liegen, selbst wenn ich nur

Code

<script type="text/javascript"><!--  // --!></script>

stehen hab, zerreisst Opera die Seite, bei kompletter Entfernung zeigt er die Seite wieder schön an. Ähm hallo?

PS: Zur Ergänzung, ich hab das Script jetzt statt im Header in der Sidebar eingefügt, jetzt zeigt Opera zwar die Seite schön an, aber mit dem Code kann er gar nichts anfangen, anders als Safari, der die Flickr-Bilder wie gewohnt anzeigt, also langsam zweifle ich an mir selbst..

PPS: Öhm.. jetzt scheint's zu klappen, hab einfach das "!" aus "--!>" rausgenommen.. also wenn das jetzt echt geht.. dann aber...

marX

JavaScript-code in HTML-Kommentare einzuschließen ist in modernen Browsern nicht mehr nötig. Allerdings solltest du bei XHTML den Script-Bereich explizit als CDATA auszeichnen, in XHTML ist das sonst standardmäßig PCDATA (d.h. geparster HTML-Code), und da machen dann HTML-Sonderzeichen wie '<' und '&' Probleme.
SELFHTML: HTML/XHTML / XHTML und HTML / Unterschiede zwischen XHTML und HTML

Code

<script type="text/javascript">
// <![CDATA[ 
  /* JavaScript-Kommentar: jetzt folgt ein kleines Script */
  if (parseInt(navigator.appVersion) < 5)
    alert("Oh, ein sehr alter Browser");
  /* und damit ist das Script auch schon zu ende */
// ]]> 
</script>

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Javascript Fehler

Jetzt mitmachen!