peterS.: Verhalten und Layout geschickt trennen und wieder zusammenführen

Beitrag lesen

gruss Christoph,

Das passt in dem Fall nicht so gut. Meine Idee ist eigentlich folgende:
Ich mach ein Formular, welches man natürlich auch ausdrucken können soll.
Damit man es auch ausgedruckt noch gut ausfüllen kann, blend ich die
(ausgedruckt) häßlichen Input Felder aus. Sollte aber jemand schon online
was reingeschrieben haben, muss das natürlich auch ausgedruckt werden.
Das würde an sich schon klappen, nur hauts mir irgendwie dann die Schriftgröße
etc. wieder durchnander, und da hätt ich gern die Möglichkeit no a bissle
rumzumändern ...

dann setzt doch die obige textaufgabe einfach nur um:

css-regeln - grob fuer die streber-browser (musst Du dann noch anpassen):

input[type=text] {/*  
  was auch immer als default  
\*/  
}  
@media print {/*  
  
  input[type=text], bzw. nur \*/  
  input[type=text].empty {  
    display: none;  
  }  
  input[type=text].notEmpty {/*  
    was auch immer, um beim druck gut auszusehen.  
  \*/  
  }  
}

und jetzt zum JavaScript-teil, der code ist nur beispielhaft und
kann/sollte/muss mit der bibliothek Deiner wahl umgesetzt werden:

(function () {  
  
  
  var regXWhiteSpaceOnly = (/^\s+$/);  
  var regXClassNameEmpty = (/(?:\s+|^)empty(?:\s+|$)/g);  
  var regXClassNameNotEmpty = (/(?:\s+|^)+notEmpty(?:\s+|$)/g);  
  
  
  var applyClassName = (function () {  
  
    var str = this.value;  
    if ((str === "") || regXWhiteSpaceOnly.test(str)) {  
  
      this.className = this.className.replace(regXClassNameNotEmpty, "").replace(regXClassNameEmpty, "") + " empty";  
  
    } else {  
  
      this.className = this.className.replace(regXClassNameNotEmpty, "").replace(regXClassNameEmpty, "") + " notEmpty";  
    }  
  });  
  
  
  var enablePrintBehavior = (function () {  
  
    Array.forEach(document.getElementsByTagName("input"), (function (elm/*, idx, arr*/) {  
  
      if (elm.type == "text") {  
  
        applyClassName.call(elm);  
  
        elm.onblur = applyClassName;  
      }  
    }));  
  
    delete arguments.callee;  
  });  
  
  
  (function () {  
  
    if (window.addEventListener) {  
      window.addEventListener("load", enablePrintBehavior, false);  
    } else if (window.attachEvent) {  
      window.attachEvent("onload", enablePrintBehavior);  
    }  
    delete arguments.callee;  
  
  })();  
  
  
})();

so long - peterS. - pseliger@gmx.net

--
»Because objects in JavaScript are so flexible, you will want to think differently about class hierarchies.
Deep hierarchies are inappropriate. Shallow hierarchies are efficient and expressive.« - Douglas Crockford
ie:( fl:) br:> va:( ls:& fo:) rl:) n3;} n4:} ss:} de:µ js:} mo:? zu:]