[GastForen Programmierung/Entwicklung JavaScript Events :- hintergrund & text farben ändern mit onkeyup und nür bestimmte Ziffern

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

Events :- hintergrund & text farben ändern mit onkeyup und nür bestimmte Ziffern

here4fun
Beiträge gesamt: 47

9. Aug 2004, 01:50
Beitrag # 1 von 6
Bewertung:
(2945 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<!-- kommentar weiß nicht so ganz weiter ... z.b. nur tabelle ist zulassbar ?-->
<html>
<head>
<title>EVENTS</title>
<script type="text/javascript">
function tastendruck() {
var charASC = event.keyCode(onkeyup);
var charSTD = String.fromCharCode(charASC);
alert("Das war ein " + charSTD);
return true;
}
document.onkeyup = tastendruck;
</script>
</script>
</head>
<body onkeyup="tastatur(event);">
<center>
<h2> JASC LE9 Events : <br>Benutzer Definierte bgcolor & textcolor </h2>
<br>
<h3>Hier kannst du das Aussehen des Fensters ganz alleine bestimmen</h3>
<br>
<form name ="formular">
<table>
<tr>
<td align="right"><b>Hintergrundfarbe: #</b></td>
<td><input type="text" name="h_farbe" size="6"
onkeyup="function h_farbe ()"></td></tr>
<tr>
<td align="right"><b>Textfarbe: #</b></td>
<td><input type="text" name="t_farbe" size="6"
onkeyup="function t_farbe()"></td></tr>
<!--Kommentar -->
</table>
<br><br>
<table cellpadding="3" cellspacing="1" border="1" width="600">
<tr>
<td align="center" width="150">0</td><td align="center" width="150">48</td><td align="center" width="150">A</td><td align="center" width="150">65</td>
</tr>
<tr>
<td align="center" width="150" >1</td><td align="center" width="150">49</td><td align="center" width="150">B</td><td align="center" width="150">66</td>
</tr>
<tr>
<td align="center" width="150">2</td><td align="center" width="150">50</td><td align="center" width="150">C</td><td align="center" width="150">67</td>
</tr>
<tr>
<td align="center" width="150">3</td><td align="center" width="150">51</td><td align="center" width="150">D</td><td align="center" width="150">68</td>
</tr>
<tr>
<td align="center" width="150">4</td><td align="center" width="150">52</td><td align="center" width="150">E</td><td align="center" width="150">69</td>
</tr>
<tr>
<td align="center" width="150">5</td><td align="center" width="150">53</td><td align="center" width="150" >F</td><td align="center" width="150">70</td>
</tr>
<tr>
<td align="center" width="150">6</td><td align="center" width="150">54</td><td align="center" width="150">Backspace</td><td align="center" width="150">8</td>
</tr>
<tr>
<td align="center" width="150">7</td><td align="center" width="150">55</td><td align="center" width="150">&nbsp;</td><td align="center" width="150">&nbsp;</td>
</tr>
<tr>
<td align="center" width="150">8</td><td align="center" width="150">56</td><td align="center" width="150">&nbsp;</td><td align="center" width="150">&nbsp;</td>
</tr>
<tr>
<td align="center" width="150">9</td><td align="center" width="150">57</td><td align="center" width="150">&nbsp;</td><td align="center" width="150">&nbsp;</td>
</tr>
</table>
</form>
<p> ... </p>
</font>
</center>
<noscript> Ihr Browser versteht Leider kein Javascript ! </noscript>
</body>
</html>
X

Events :- hintergrund & text farben ändern mit onkeyup und nür bestimmte Ziffern

here4fun
Beiträge gesamt: 47

9. Aug 2004, 18:05
Beitrag # 2 von 6
Beitrag ID: #101884
Bewertung:
(2945 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
War als frage nicht überschaubar nehme ich an ... ( Bin Englisch) I have a problem I can't seem to be able to solve. Thus feel free to give advive. Given is :
1)HTML hexadezimal codes to be used. User is only allowed to use following digets, browser is not allowed to display any other & user is to get an error message. Allowed are 0 - 9 , 48 - 57 , Capital A - F & backspace , last set 65 - 70 & 8.
2) 2 text fields where the user can enter the HTML color codes eg #FFFF00 for yellow error message when more than 6 digets filled in
3) Event onkeyup ( heres my biggest problem the color should change when user has filled in the 6 piece html color code , hence onBlur I'd think or !onFocus. but how do I nake this happen ? )
4) Script has to work for both IE and Navigator

my 2nd attempt:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>JASC LE9 EVENTS s01k4305</title>
<script type="text/javascript">
<!--
function check() {
if((navigator.appName == "Microsoft Internet Explorer") &&
((event.keyCode < 8 || event.keyCode > 8) &&
(event.keyCode < 48 || event.keyCode > 57) &&
(event.keyCode < 65 || event.keyCode > 70))) {
event.returnValue = false;
alert("Das ist keine HTML bekannte hexadezimalen Code!")
} else {
document.captureEvents(Event.KEYPRESS);
event();
}
}
document.onkeypress = function(event) {
if((event.which < 8 || event.which > 8) &&
(event.which < 48 || event.which > 57) &&
(event.which < 65 || event.which > 70)) {
return false;
}
}
function hg_farbe(h_farbe) {
if (h_farbe.length < 6) {
alert ("Wer kann da nicht bis 6 zählen? - Die Hintergrundfarbe bleibt, wie sie ist!");
} else {
var colorString ="#" + h_farbe;
document.bgColor=colorString;
}
}
function tx_farbe(t_farbe) {
if (t_farbe.length < 6) {
alert ("Wer kann da nicht bis 6 zählen? - Die Textfarbe bleibt, wie sie ist!");
} else {
var colorString ="#" + t_farbe;
document.fgColor=colorString;
}
}
//-->
</script>
</head>
<body>
<center>
<form name ="formular">
<table>
<tr>
<td align="center"><b>Bitte nur HTML bekannten hexadezimalen Codes Eintragen.</b></td>
</tr>
<tr><td>&nbsp;</td></tr>
<tr>
<td align="center">Hintergrundfarbe: #
<input type="text" name="h_farbe" size="10" maxlength="6"
onKeypress="check()"
onchange="hg_farbe(document.formular.h_farbe.value)"></td></tr>
<tr>
<td align="center">Textfarbe: #
<input type="text" name="t_farbe" size="10" maxlength="6"
onKeypress="check()"
onchange="tx_farbe(document.formular.t_farbe.value)"></td></tr>
</table>
</form>
<br><br><br>
<p>
<h4>Murphy's 10 Gesetze</h4>
1.Nichts ist so leicht, wie es aussieht.<br>
2.Alles dauert l&auml;nger als man glaubt.<br>
3.Wenn es die M&ouml;glichkeit gibt, dass Dinge schief gehen, dann werden sie so schief gehen, dass es den gr&ouml;&szlig;ten Schaden anrichtet.<br>
4.Es wird immer genau eine M&ouml;glichkeit mehr geben, wie etwas schief gehen kann, wie man ausgeschaltet hat.<br>
5.Dinge sich selbst zu &uuml;berlassen, f&uuml;hrt vom Regen in die Traufe.<br>
6.Immer wenn man sich ernsthaft mit etwas befassen m&ouml;chte, kommt etwas anderes dazwischen.<br>
7.Jede L&ouml;sung bringt mindestens zwei neue Probleme.<br>
8.Es ist unm&ouml;glich, etwas ganz sicher zu machen, denn Dummk&ouml;pfe sind zu erfinderisch.<br>
9.Die Natur ergreift immer Partei f&uuml;r den versteckten Fehler.<br>
10.Mutter Natur ist ein b&ouml;ses Weib.<br>
<br>
<b><i>" Murphy war ein Optimist ! "</i></b><br>
</p>
</font>
</center>
<noscript> Ihr Browser versteht Leider kein Javascript ! </noscript>
</body>
</html>


als Antwort auf: [#101756]

Events :- hintergrund & text farben ändern mit onkeyup und nür bestimmte Ziffern

oesi50
  
Beiträge gesamt: 2315

9. Aug 2004, 19:31
Beitrag # 3 von 6
Beitrag ID: #101903
Bewertung:
(2945 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
hi here4fun,

captureEvents() is Netscape only. What about onKeyup="check()" for all others.

see my example:
<script type="text/javascript">
<!--
var NN = document.layer ? 1 : 0;
var IE = document.all ? 1 : 0;
var DOM = document.getElementById ? 1 : 0;

if(NN){
document.onKeyUp="check(event.target)"
}

function check(farbe) {
re = /([0-9a-fA-F]*).*/;
farbe.value = farbe.value.replace(re, "$1");
if(farbe.value.length < 6){
return;
}
if(farbe.name == 'h_farbe'){
document.bgColor = "#" + farbe.value;
}
if(farbe.name == 't_farbe'){
document.fgColor = "#" + farbe.value;
}

}
//-->
</script>
</head>
<body>
<center>
<form name ="formular">
<table>
<tr><td align="center"><b>Bitte nur HTML bekannten hexadezimalen Codes Eintragen.</b></td></tr>
<tr><td>&nbsp;</td></tr>
<tr><td align="center">Hintergrundfarbe: #<input type="text" name="h_farbe" size="10" maxlength="6" onKeyup="check(this)"></td></tr>
<tr><td align="center">Textfarbe: #<input type="text" name="t_farbe" size="10" maxlength="6" onKeyup="check(this)"></td></tr>
</table>
</form>


greetings Oesi
I know, that I know nothing... (Sokrates)


als Antwort auf: [#101756]

Events :- hintergrund & text farben ändern mit onkeyup und nür bestimmte Ziffern

here4fun
Beiträge gesamt: 47

9. Aug 2004, 20:20
Beitrag # 4 von 6
Beitrag ID: #101912
Bewertung:
(2945 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hi there Oesi !

Thanks. the way you identifield browsers is in chapter 12. where this exercise is chapter 9. browser is to be identified over unserAgent? and where do I add the very annoying but for homeworks very important alerts. Thats not a color ? But it works like a dream on the onkeyup="check()"

Thanks a million !


als Antwort auf: [#101756]

Events :- hintergrund & text farben ändern mit onkeyup und nür bestimmte Ziffern

oesi50
  
Beiträge gesamt: 2315

9. Aug 2004, 20:39
Beitrag # 5 von 6
Beitrag ID: #101916
Bewertung:
(2945 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
here, with alerts:

function check(farbe) {
re = /([0-9a-fA-F]*).*/;
farbe.value = farbe.value.replace(re, "$1");
if(farbe.value.length < 6){
alert ("Wer kann da nicht bis 6 zählen? - Die "+farbe.name+" bleibt, wie sie ist!");
return;
}
if(farbe.name == 'Hintergrundfarbe'){
document.bgColor = "#" + farbe.value;
}
if(farbe.name == 'Textfarbe'){
document.fgColor = "#" + farbe.value;
}
}
//-->
</script>
</head>
<body>
<center>
<form name ="formular">
<table>
<tr><td align="center"><b>Bitte nur HTML bekannten hexadezimalen Codes Eintragen.</b></td></tr>
<tr><td>&nbsp;</td></tr>
<tr><td align="center">Hintergrundfarbe: #<input type="text" name="Hintergrundfarbe" size="10" maxlength="6" onKeyup="check(this)"></td></tr>
<tr><td align="center">Textfarbe: #<input type="text" name="Textfarbe" size="10" maxlength="6" onKeyup="check(this)"></td></tr>

This is a patch, use my other code around.

greetings Oesi
I know, that I know nothing... (Sokrates)


als Antwort auf: [#101756]
(Dieser Beitrag wurde von oesi50 am 9. Aug 2004, 20:41 geändert)

Events :- hintergrund & text farben ändern mit onkeyup und nür bestimmte Ziffern

here4fun
Beiträge gesamt: 47

9. Aug 2004, 23:29
Beitrag # 6 von 6
Beitrag ID: #101947
Bewertung:
(2945 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Oesi !

Danke Sehr für die hilfe. Funktioniert 100% ;)
Thank you very much

here4fun
aka barbara


als Antwort auf: [#101756]
X

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

pdf-icon Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen
01.12.2022

Online
Donnerstag, 01. Dez. 2022, 10.00 - 10.45 Uhr

Webinar

Die drei ColorLogic-Programme ZePrA, CoPrA und ColorAnt sind in neuen Versionen mit vielen neuen Funktionen im Jahr 2022 veröffentlich worden oder werden in Kürze veröffentlicht (ColorAnt 9). In unserem ca. 45 minütigen kostenlosen Webinar zeigen wir Ihnen einige dieser neuen Funktionen mit dem Schwerpunkt auf Automatisierung und Produktivitätssteigerungen.

Ja

Organisator: Impressed GmbH

Kontaktinformation: Silvia Noack, E-Mailsnoack AT impressed DOT de

https://www.impressed.de/schulung.php?c=sDetail&sid=311

ColorLogic Update-Webinar ZePrA 10, CoPrA 9 und ColorAnt 9
Veranstaltungen
02.02.2023

Prozesse optimieren und effizient gestalten

Zürich
Donnerstag, 02. Feb. 2023, 08.00 - 10.00 Uhr

Digitalisierung, Webauftritt

Digitalisierung mitgestalten - Worauf kommt es an? Wie wichtig ist die Webseite? Webseite mit Word Press? Interne Prozesse optimieren

Ja

Organisator: B. Isik - SNF Academy

Kontaktinformation: Birol Isik, E-Mailinfo AT bkcc DOT ch

https://digitalisierung-heute.ch/digitalisierung-informationstag-schweiz/