 Willkommen auf dem Portal für Mediengestalter
|
|
|
| Autor |
Nachricht |
volle101
Threadersteller
Dabei seit: 25.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 25.05.2012 18:12
Titel
|
  |
|
Auch dir erstmal besten Dank für deinen Lösungsansatz...
Entweder bin ich zu blöd oder mein Kopf macht schon Wochenende.  So, oder so bekomme ich es mit deinem Ansatz nicht hin. Mein erstes Wundernis ist schon bei "span.galerie'-index" !?!?!? Ich habe doch gar keine Indizierung laufen!?!?!?
Ich glaube ich poste mal den entsprechenden Code der bilder.htm. Vielleicht wird dann deutlicher was ich brauche... Hier erstmal der Code:
| Code: | <td class="box2" width="25%" height="190px" style="vertical-align:top;">
<center>
<a class="iframe" href="lwcf2010.htm">
<img border="0" src="http://www.lew-online.de/GesangVereinLyra/bilder/lwcf2010.gif" width="94" height="94"><br />
</a>
<span class="galerie1" id="titel">3. Luckenwalder<br>Chorfestival<br>15.05.2010</span>
</center>
</td>
<td class="box2" width="25%" height="190px" style="vertical-align:top;">
<center>
<a class="iframe" href="cts2010.htm">
<img border="0" src="http://erzieher.bplaced.net/GesangVereinLyra/bilder/cts2010/cts2010.gif" width="94" height="94"><br />
</a>
<span class="galerie2">Chortreffen<br>Schlieben<br>04.07.2010</span>
</center>
</td>
<td class="box2" width="25%" height="190px" style="vertical-align:top;">
<center>
<a class="iframe" href="fdl2010.htm">
<img border="0" src="http://zausel.bplaced.net/GesangVereinLyra/fdl2010/bilder/fdl2010.gif" width="94" height="94"><br />
</a>
<span class="galerie3">Fest des Liedes<br>12.09.2010</span>
</center>
</td>
<td class="box2" width="25%" height="190px" style="vertical-align:top;">
<center>
<a class="iframe" href="weihn2010.htm">
<img border="0" src="http://zausel.bplaced.net/GesangVereinLyra/weihn2010/bilder/weihn2010.gif" width="94" height="94"><br />
</a>
<span class="galerie4">Weihnachtskonzert<br>15.12.2010</span>
</center>
</td>...................... usw. |
Nun möchte ich von einer anderen Seite aus
1.) den Text der span's galerie1, galerie2, galerie3, etc. auslesen und diesen dann ohne Zeilenumbruch ausgeben.
2.) den dazugehörigen Link (jeweils class="iframe") dem Div auf der anderen Seite zuordnen.
Ich glaube das ist sehr komplex und ich kämpfe ja auch schon etliche Stunden damit. Ich dachte ich bekomme es mit js hin, aber seit zwei Tagen probiere ich es mittels jQuery.
Zuletzt bearbeitet von volle101 am Fr 25.05.2012 18:12, insgesamt 1-mal bearbeitet
|
|
| |
  |
 |
bacon
Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 25.05.2012 19:33
Titel
|
|
|
|
@Mod wenn schon "editieren", dann richtig. Mein Gott -.-
|
|
| |
|
|
|
Anzeige
|
|
|
ChrisKam
Dabei seit: 01.07.2009
Ort: Hattingen
Alter: 38
Geschlecht: 
|
Verfasst Fr 25.05.2012 20:05
Titel
|
|
|
| volle101 hat geschrieben: | Auch dir erstmal besten Dank für deinen Lösungsansatz...
Entweder bin ich zu blöd oder mein Kopf macht schon Wochenende. So, oder so bekomme ich es mit deinem Ansatz nicht hin. Mein erstes Wundernis ist schon bei "span.galerie'-index" !?!?!? Ich habe doch gar keine Indizierung laufen!?!?!? |
Brauchst du ja auch nicht, .each(function(index)){} erledigt das für Dich für jedes Element im Stack. http://api.jquery.com/each/ für dein Problem brauchst du überhaupt keine IDs. Gib einfach jedem DIV auf deiner neuen Seite class="link" oder noch besser, pack sie alle in ein DIV mit class="links"; der Selektor wäre dann $('div.link div'). Dort solten aber dann keine anderen DIVs mehr enthalten sein.
Ich habe schon verstanden, was du machen willst, auch wenn ich den Sinn dahinter ehrlich gesagt nicht begreife. Komplex ist das auch nicht. Das HTML, dass du da verwendest ist gefühlt 1998 und eine ziemlich Katastrophe, Iframes, Tabellen usw. braucht man nur noch in Ausnahmefällen.
Was meinst du mit "den dazugehörigen Link (jeweils class="iframe") dem Div auf der anderen Seite zuordnen." - soll das DIV mit einem <a> umschlossen werden, der sein href von der anderen Seite bekommt? Dann lade den ganzen Teil ($(td.box2 a)) und hol Dir das href Attribut mit http://api.jquery.com/attr/
|
|
| |
 |
|
volle101
Threadersteller
Dabei seit: 25.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 25.05.2012 21:18
Titel
|
|
|
Hallo ChrisKam,
vielen Dank für deine Erläuterungen!!!
Also die Sache mit dem each habe ich tatsächlich hinbekommen.  Ein kleiner Fehler ist allerdings trotzdem auf getaucht: Die Inhalte werden erst ab dem 2. Div.link übernommen bzw. eingetragen. Ich habe einfach ein zusätzliches mit display:none eingesetzt und nun steht schonmal alles so da, wie ich es brauche.
Mein Problem ist jetzt der Punkt mit den hrefs. Du hast es ganz richtig erfasst: | Zitat: | | das DIV mit einem <a> umschlossen werden, der sein href von der anderen Seite bekommt |
Ich verstehe was du meinst, aber ich verstehe nicht was und wie | Zitat: | | lade den ganzen Teil... |
und meint. Ich denke dafür bin ich noch viel zu kurz mit jQuery beschäftigt.
Achso, Sinn dahiter ist... Inhalte aus der Webseite auslesen und für die smartphone-variante verwenden. Wenn ich nun auf der "Original"-Galerie-Seite eine Aktualisierung vornehme, ist sie auf der mobilen Seite automatisch verfügbar.
Ja, ich weiß... Tabellen, iframes... usw. Wobei "iframe" bei mir nur als class verwendet wird. auf der tatsächlichen Seite ist es ein Div-layer der sich als colorbox über die Hauptseite legt... sowas ähnliches wie highslide. Von alle dem mal abgesehen habe ich die Seite vor 7 Jahren geschrieben und freue mich noch heute über das Ergebnis. Dafür dass ich sowas nur nebenbei mache... Wenn du neugierig sein solltest: gesangverein-lyra.de
|
|
| |
|
|
volle101
Threadersteller
Dabei seit: 25.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 25.05.2012 22:25
Titel
|
|
|
Hallo nochmal,
also das war jetzt mein Ansatz:
| Code: | $('a.link').each(
function( intIndex ){
$(this).get('http://www.gesangverein-lyra.de/bilder.htm div#galerieauswahl td.box2 a'+index,function(){
var newHREF = $( this ).attr('href');
$( this ).attr('href', newHREF);
});
}
);
}); |
Wobei dazugehöriger html-code so aussieht:
| Code: | <!-- Anfang GALERIE-LINK 2 -->
<div class="context" style="min-height:35px; border-bottom:1px #e0e0e0 solid; background-color:#fff; cursor:pointer;">
<div class="listing_head">
<a class="link" href="test" target="_self">
<div class="link" style="color:#000;font-weight:bold;">Bitte warten...</div>
</a>
</div>
</div>
<!-- ENDE GALERIE-LINK 2 --> |
Naja, was soll ich sagen. Es klappt mal wieder nicht so, wie gedacht. 
|
|
| |
|
|
volle101
Threadersteller
Dabei seit: 25.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Sa 26.05.2012 09:07
Titel Leider immernoch kein Erfolg |
|
|
Guten Morgen schön,
ich habe jetzt mal neu geschraubt und ein ganz simples snippes eingesetzt. Für mich sieht das unglaublich logisch aus und sollte die attribute der href's bei allen Elementen der Klasse link ersetzen durch die geladenen hrefs aus td.bx2 a.
Das macht es aber nicht 
| Code: | $('.link').attr('href').each(function(intIndex ){
$(this).load('http://www.gesangverein-lyra.de/bilder.htm div#galerieauswahl td.box2 a'+intIndex,function(){
});
}); |
Zuletzt bearbeitet von volle101 am Sa 26.05.2012 09:11, insgesamt 3-mal bearbeitet
|
|
| |
|
|
ChrisKam
Dabei seit: 01.07.2009
Ort: Hattingen
Alter: 38
Geschlecht:
|
Verfasst Sa 26.05.2012 10:52
Titel
|
|
|
Hallo Volker,
ich habe gerade nicht viel Zeit aber wenn ich das richtig überflogen habe, hast du Den Index nicht ganz richtig eingesetzt - denn die <a> Elemente in deinem Zieldokument haben kein class="link1" class="link2" usw., anders als die spans, die sehr wohl class=galerie1 class=galerie2 usw. aufweisen. Dieser Selektor
| Code: | | div#galerieauswahl td.box2 a'+intIndex |
läuft deshalb ins Leere. Auf das Callback kannst du da ebenfalls verzichten das am Ende der load Funktion steht. Auch würdest Du so garnicht an das href Attribut des <a> Elementes, dass Du lädst, kommen. Mit dem Code wie er da steht, versucht Du das href Atrribut mit dem gesamten <a> zu ersetzen, was nicht klappen kann.
Was du machen jetzt machen solltest:
Pack den ganzen .load() Teil in eine Variable, nimm allerdings das ganze Dokument bzw. die ganze relevante Tabelle.
Für jedes each() greifst du nun nach wie vor auf die <span> aus der Variable zu, traversierst dann aber davon ausgehend von den <span> mit "galerie1", "galerie2" usw. zu den entsprechenden <a> Elementen, schnappst dir das href Attribut und wrapst Dein neues DIV in ein <a>.
*traversieren: http://net.tutsplus.com/tutorials/javascript-ajax/10-super-helpful-traversing-functions-in-jquery/
** wrappen: http://api.jquery.com/wrap/
|
|
| |
|
|
volle101
Threadersteller
Dabei seit: 25.05.2012
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Sa 26.05.2012 12:48
Titel
|
|
|
Hallöchen,
danke dass du dir die Zeit genommen hast. Leider war ich immernoch nicht erfolgreich.
Mein Ergebnis war jetzt:
| Code: | $(document).ready(function(){
$('div.link').each(function(index){
$(this).load('http://www.gesangverein-lyra.de/bilder.htm div#galerieauswahl td.box2 span.galerie'+index,function(){
$('br', this).replaceWith(' ');
});
});
$('a.link').each(function(index){
$(this).load('http://www.gesangverein-lyra.de/bilder.htm div#galerieauswahl a#link'+index,function(refs){
$('div.link').parent().wrap("<a href="+refs+" target='_blank'></a>")
});
});
}); |
Nachdem ich damit keinen Erfolg hatte, kam ich auf die Idee es so ähnlich wie bei den spans zu machen. Daher sind auch die a's indiziert.
Vielleicht mal den Code... Hier die entsprechende Stelle in der Ziel-Datei:
| Code: | <!-- Anfang GALERIE-LINK 2 -->
<div class="context" style="min-height:35px; border-bottom:1px #e0e0e0 solid; background-color:#fff; cursor:pointer;">
<div class="listing_head">
<a class="link" href="test" target="_self">
<div class="link" style="color:#000;font-weight:bold;">Bitte warten...</div>
</a>
</div>
</div>
<!-- ENDE GALERIE-LINK 2 -->
<!-- Anfang GALERIE-LINK 2 -->
<div class="context" style="min-height:35px; border-bottom:1px #e0e0e0 solid; background-color:#fff; cursor:pointer;">
<div class="listing_head">
<a class="link" href="test" target="_self">
<div class="link" style="color:#000;font-weight:bold;">Bitte warten...</div>
</a>
</div>
</div>
<!-- ENDE GALERIE-LINK 2 -->
<!-- Anfang GALERIE-LINK 3 -->
<div class="context" style="min-height:35px; ... USW |
In der Quell-Datei haben den entsprechenden a's eine id gegeben, um sie gezielt auslesen zu können:
| Code: | <div id="galerieauswahl" class="galerieauswahl" name="galerieauswahl">
<div align="center" style="z-index:1;">
<table border="0" width="90%" cellspacing="1">
<tr>
<td class="box2" width="25%" height="190px" style="vertical-align:top;">
<center>
<a id="link1" class="iframe" href="lwcf2010.htm">
<img border="0" src="http://www.lew-online.de/GesangVereinLyra/bilder/lwcf2010.gif" width="94" height="94"><br />
</a>
<span class="galerie1">3. Luckenwalder<br>Chorfestival<br>15.05.2010</span>
</center>
</td>
<td class="box2" width="25%" height="190px" style="vertical-align:top;">
<center>
<a id="link2" class="iframe" href="cts2010.htm">
<img border="0" src="http://erzieher.bplaced.net/GesangVereinLyra/bilder/cts2010/cts2010.gif" width="94" height="94"><br />
</a>
<span class="galerie2">Chortreffen<br>Schlieben<br>04.07.2010</span>
</center>
</td>
<td class="box2" width="25%" height="190px" style="vertical-align:top;">
<center>
<a id="link3" class="iframe" href="fdl2010.htm"> ... USW |
Nun stelle ich aber fest, dass es immernoch nicht geht. Ich erhalte beim Aufruf der Seite jeweils die komplette html, anstatt einfach die hrefs ersetzt werden.
Ich habe es auch schon mit folgender Variante probiert:
| Code: | $('a.link').each(function(index){
$(this).load('http://www.gesangverein-lyra.de/bilder.htm div#galerieauswahl a#link'+index,function(refs){
$('a.link').attr('href', refs)
});
}); |
Damit produziert er mir - neben dem gewünschten Link - die Vorschaulbilder der Originalseite, welche nun mittels kompletten html-Text der Originalseite im href von a.link ausgegeben werden.
Ich überlege schon, ob ich mobilen Endnutzern überhaupt das Vergnügen einer Galerie einräumen soll.
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
window.alert popUP
Alert Box kommt automatisch
Flash Objekt -> Alert Fenster bei ie6?
Javascript Wuiz - wie schalteich die Alert-Messages ab
JavaScript wird im IE nicht ausgeführt!
[php] return wird nicht ausgeführt
|
|
|
Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.
|
|
