Programmierung Javascript

Dieses Thema im Forum "Webentwicklung" wurde erstellt von Reamos, 24. Februar 2007 .

  1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen
  1. #1 24. Februar 2007
    Zum Thema: Programmierung Javascript
    Formularfelder markieren

    Formulare

    In umfangreichen Formularen verlieren die Nutzer schnell den Überblick.Da hilft es, das aktuelle Eingabefeld ein wenig hervorzuheben. Das geht am einfachsten per Javascript und CSS. Das folgende Beispiel ändert die Umrandung eines Eingabefeldes, sobald es den Fokus erhält. Das passiert zum Beispiel dann, wenn der Besucher der Seite in das Feld klickt. Verlässt der Besucher das Feld wieder, verliert das Feld den Fokus und färbt sich wieder normal. Das Programm dazu sieht so aus:

    <html>
    <head>
    <title>Demo</title>
    <style type="text/css">
    normal {border: solid black 1px;}
    highlight {border: solid red 2px;}
    </style>
    <script type="text/javascript">
    function changeCSSClass
    (element,newClass)
    {
    document.getElementById(element.id).className = newClass;
    }
    </script>
    </head>

    <body>
    <form action="" method="GET">
    <input id="nname" class="normal" name="nachname" onfocus="javascript:changeCSSClass (this, 'highlight')"
    onblur="javascript:changeCSSClass (this, 'normal')"/>
    <input type="submit"/>
    </form>
    </body>
    </html>
    Zunächst definieren Sie die beiden Stilvorlagen für die Umrandung als Klassen. Danach geht es an das Kernstück: Die Funktion changeCSSClass erwartet als Parameter ein Element und die Bezeichnung der Klasse, die es zuweisen soll. Anhand der mit element.id ermittelten eindeutigen Kennung des Elements kann Javascript der Eigenschaft class Name nun eine neue Klasse zuweisen.
     

  2. Anzeige
    Dealz: stark reduzierte Angebote finden.
  3. #2 24. Februar 2007
    AW: Programmierung Javascript

    *moved to Webtechnik
     
  4. #3 24. Februar 2007
    AW: Programmierung Javascript

    Warum so, wenns auch mit CSS ohne JS geht?

    <style type="text/css">
    input {
    background-color: #CDCDCD;
    }
    input:hover, input:focus, input:active {
    background-color: #C0C0C0;
    }
    </style>


    (oder so ähnlich ;))
     

  5. Videos zum Thema
Die Seite wird geladen...
Similar Threads - Programmierung Javascript
  1. Antworten:
    0
    Aufrufe:
    443
  2. Antworten:
    0
    Aufrufe:
    975
  3. Antworten:
    13
    Aufrufe:
    1.982
  4. Excel, iWorks "Programmierung"

    Kadashi , 30. Oktober 2012 , im Forum: Macintosh
    Antworten:
    0
    Aufrufe:
    1.136
  5. Antworten:
    5
    Aufrufe:
    1.554
  • Annonce

  • Annonce