Problem mit getElementById

Ja richtig, es funktionier auch bei "@", aber nicht wenn man die Emails in eine Tabelle packt.

Also so:
HTML:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><a class="wrap" href="#">namedesemailbesitzers@irgendwas-und-irgendwie.com</a></td>
  </tr>
  <tr>
    <td><a class="wrap" href="#">namedesemailbesitzers@irgendwas-und-irgendwie-zwei.com</a></td>
  </tr>
  <tr>
    <td><a class="wrap" href="#">namedesemailbesitzers@irgendwas-und-irgendwie-zwei-und-drei.com</a></td>
  </tr>
</table>

Übrigens bin ich einwenig verwirrt. Nach einem Neustart funktioniert jetzt auch der Umbruch nach "-" in TABLE nicht mehr. Anbei ein Anhang mit einer Ansicht meines Browsers (FF 2.0) - oben ohne, unten gelb mit TABLE.
 
Hi,

offensichtlich wird die Breite der Zelle, die beim Laden der Seite angelegt wird, durch eine Zuweisung über innerHTML nicht mehr geändert (zumindest im FF kleiner Version 3).

Wird der Inhalt stattdessen über DOM-Methoden geändert, z.B. appendChild, werden auch die Dimensionen neu bestimmt.

Möglich wäre ein Workaround für Tabellen für Nicht-IEs. Ob das allerdings für alle Kombinationen und in jedem Browser funktioniert, kann ich nicht garantieren.
Code:
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function getElementsByClassName(){
  // getElementsByClassName.arguments[0] => Name der Klasse (string)

  var arrHelp = new Array();

  // Array mit allen Kindelementen erstellen
  var arrTags = (navigator.userAgent.toLowerCase().indexOf("msie") != -1) ? document.all : document.getElementsByTagName('*');

  // Suchmuster erstellen
  var strPattern = eval("/\\b"+getElementsByClassName.arguments[0]+"\\b/");

  // Alle Elemente durchlaufen
  for(var varEntry in arrTags){
    // Fall eine Klasse existiert UND dem Suchkriterium entspricht
    if((arrTags[varEntry].className) && (arrTags[varEntry].className.match(strPattern))){
      // In Klassenarray schreiben
      arrHelp[arrHelp.length] = arrTags[varEntry];
    }
  }

  return arrHelp;  // Elemente mit übereinstimmenden Klassenname zurück geben (array)
}

function showWrap(string) {
 var wrap = new Object();
  wrap['@'] = '@';
  wrap['-'] = '-';

  for (value in wrap) {
    wbr = wrap[value] + "<wbr>";
    var search = RegExp("[.*]?("+ value +")[.*]?","gi");
    string = string.replace(search, wbr);
  }
  return string;
}

window.onload = function() {
  // Array mit allen Elementen erstellen, welche die Klasse "wrap" enthalten
  var arrWrap = getElementsByClassName("wrap");

  // Array durchlaufen
  for(var i=0; i<arrWrap.length; i++){
    string = arrWrap[i].innerHTML;
    arrWrap[i].innerHTML = showWrap(string);

    // Falls es sich nicht um einen IE handelt
    if(!(document.all && !window.opera)){
      var objParent = arrWrap[i].parentNode;
      // Elternknoten durchlaufen
      while(objParent){
      	// Falls es sich um eine Tabelle handelt -> tbody-Objekt erneut einhängen
        if(objParent.nodeName.toLowerCase() == "table"){
          var objBody = objParent.getElementsByTagName("tbody")[0];
          objParent.innerHTML = "";
          objParent.appendChild(objBody);
          break;
        }
        objParent = objParent.parentNode;
      }
    }
  }
}

//-->
</script>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0" id="firstTable">
  <tr>
    <td><a class="wrap" href="#">namedesemailbesitzers@irgendwas-und-irgendwie.com</a></td>
  </tr>
  <tr>
    <td><a class="wrap" href="#">namedesemailbesitzers@irgendwas-und-irgendwie-zwei.com</a></td>
  </tr>
  <tr>
    <td><a class="wrap" href="#">namedesemailbesitzers@irgendwas-und-irgendwie-zwei-und-drei.com</a></td>
  </tr>
</table>
</body>
</html>
Vielleicht hilft dir das weiter.

Ciao
Quaese
 

Neue Beiträge

Zurück