• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Mit Javascript Hintergrundfarbe ändern aus Formular

Status
Für weitere Antworten geschlossen.
S

seos2k

Neues Mitglied
habe folgendes Problem, ich hab ein Formular in das man die rgb Werte hexadezimal eintippen soll und diese Farbe als string dann nach klicken des buttons zur hintergrundfabre übernommen werden soll, habe aber fehler im script und kom von alleine nicht dahinter, wer kann mir helfen??

hier mal der quelltext:


<html>

<head>
<title>Hintergrund</title>
<style>
table{


background-color:#CCCCCC;
}
</style>

</head>

<body bgcolor="white">

<h2>Hintergrund</h2>

<form name="F">
<table cellpadding=8 >
<tr><td>rot:&nbsp&nbsp&nbsp&nbsp&nbsp</td><td><input type=text size=2 name="r"></td></tr>
<tr><td>grün:</td><td><input type=text size=2 name="g"></td></tr>
<tr><td>blau:</td><td><input type=text size=2 name="b"></td></tr>
<tr><td>&nbsp</td><td><input type="button" value="übernehmen&nbsp" onclick='document.bgColor=document.F."r".value + document.F."g".value + document.F."b".value;'>
</td></tr>
</table>
</form>
</body>

</html>
 
klappt immernoch nicht,woran kann das liegen?

1)soweit ich weiß is das # nicht notwendig

2) bei "das input" wie muss ich die werte "r" "g" "b" addieren, dass der string stimmt

egal wie ich es probiere, der hintergrund bleibt immer weiss

ich verzweifel, seit zwei tagen rätsel ich an diesem problem rum
 
Dann so:
Code: 
window.onload = function () {
    var r = document.getElementById("r");
    var g = document.getElementById("g");
    var b = document.getElementById("b");
    var button = document.getElementById("button");
    var body_style = document.body.style;

    button.onclick = function () {
        body_style.backgroundColor = "#" + r.value + g.value + b.value;
    }
}
 
vermutlich weißt du mehr als ich, ich denk ich füge nur dein code falsch in meine html ein, zum laufen hab ich es noch nicht gebracht, zuletzt hab ich es so probiert

<html>

<head>
<title>Hintergrund</title>

<style>
table{


background-color:#CCCCCC;
}
</style>

</head>

<body bgcolor="white">

<h2>Hintergrund</h2>

<form name="F">
<table cellpadding=8 >
<tr><td>rot:&nbsp&nbsp&nbsp&nbsp&nbsp</td><td><input type=text size=2 name="r"></td></tr>
<tr><td>grün:</td><td><input type=text size=2 name="g"></td></tr>
<tr><td>blau:</td><td><input type=text size=2 name="b"></td></tr>
<tr><td>&nbsp</td><td><input type="button" value="übernehmen&nbsp" button.onclick = function () {
body_style.backgroundColor = "#" + r.value + g.value + b.value;
}>
</td></tr>
</table>
</form>
window.onload = function () {
var r = document.getElementById("r");
var g = document.getElementById("g");
var b = document.getElementById("b");
var button = document.getElementById("button");
var body_style = document.body.style;


}

</body>

</html>



hab es in verschiedenen variationen ausprobiert, mit script tags und ohne, bin mir an vielen stellen mit semikolons und anführungszeichen nicht sicher,
 
Wie wäre es mal, wenn du HTML&CSS lernen würdest?

Das ganze muss in <script type="text/javascript"> in <head>. Dann brauchen deine INPUTs noch eine entsprechende ID.
 
mehr infos hab ich auch net gebraucht, danke, also ich hab deinen rat befolgt tml und css gelernt, und das alte testament, schaden kann es chonmal nicht, dann habe ich es so zusammengesetzt, und es hat getan, danke an crash

<html>

<head>
<script type="text/javascript">
window.onload = function (farbe) {
var r = document.getElementById("r");
var g = document.getElementById("g");
var b = document.getElementById("b");
var button = document.getElementById("button");
var body_style = document.body.style;

button.onclick = function (farbe) {
body_style.backgroundColor = "#" + r.value + g.value + b.value;
}
}
</script>
<title>Hintergrund</title>
<style>
table{


background-color:#CCCCCC;
}
</style>

</head>

<body bgcolor="white">

<h2>Hintergrund</h2>

<form name="F">
<table cellpadding=8 >
<tr><td>rot:&nbsp&nbsp&nbsp&nbsp&nbsp</td><td><input type=text size=2 id="r"></td></tr>
<tr><td>grün:</td><td><input type=text size=2 id="g"></td></tr>
<tr><td>blau:</td><td><input type=text size=2 id="b"></td></tr>
<tr><td>&nbsp</td><td><input type="button" value="übernehmen&nbsp" onclick="document.body.style.backgroundColor = '#'+ document.getElementById('r').value + document.getElementById('g').value+ document.getElementById('b').value">
</td></tr>
</table>
</form>
</body>

</html>
 
die tabelle hab ich gemacht, weil die seite genauso auszusehen hatte wie es die aufgabenstellung verlangt,

also ich hab in informatik ne pdf bekommen und muss die dort gezeigte seite mit speziellen eigenschaften schreiben, mit der tabelle ging es am schnellsten und als die lösung rauskam hab ich festgestellt, das ich recht hatte
 
seos2k schrieb:
die tabelle hab ich gemacht, weil die seite genauso auszusehen hatte wie es die aufgabenstellung verlangt
Zum Vergrößern anklicken....
Aber Aussehen macht man mit CSS und nicht mit HTML. HTML ist nur für die logische Auszeichnung da, und Formulardaten sind keine tabellarischen Daten.

mit der tabelle ging es am schnellsten und als die lösung rauskam hab ich festgestellt, das ich recht hatte
Zum Vergrößern anklicken....
Klar geht immer das am schnellsten, was man besser kann. Wenn man aus Australien kommt, kann man besser im Linksverkehr fahren, dennoch ist das in Deutschland verboten.
Wenn man noch den Hack aus den 1990er Jahren intus hat, Layout mit HTML zu machen, obwohl es seit fast 10 Jahren CSS gibt, geht das natürlich schneller. Es ist zwar nicht verboten, aber überflüssig und mit einigen Nachteilen behaftet.

Wenn es hier nur um eine Aufgabenstellung ging, die verlangt hat, diese Optik zu erreichen, egal mit welchen Mitteln, dann ist das wahrscheinlich legitim, aber sinnvoll ist es nicht. Und wenn Du in der Branche bleiben willst, solltest Du ans Umlernen denken, bevor Du den Zug verpasst.
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben