nicht angemeldet
TSHallo und guten Abend,
ich glaube meine Frage ist ganz einfach für euch. also was ich möchte, ist ein Button erstellen auf dem steht " platz Frei" und dieser soll grün sein. Wenn ich darauf klicke soll er rot werden und es soll stehen Platz besetzt. Wenn man wiederum darauf klickt soll wieder Platz Frei kommen. Ich kenne mich leider gar nicht mit html aus. Könnte mir jemand vlt. so ein Text vormachen, damit ich evtl. nur die grösse des Buttons ändern könnte. Das wäre einfach SUPER!!
Ich habe Dir etwas gebastelt. Bitte versuche DU doch nun mal zu erklären, was da passiert :-)
<!Doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
#b1, #b2, #b3
{
background-color: #00FF00;
width: 5rem;
font-size: 1.2rem;
}
</style>
<title>Buttons mit Eventlistener</title>
</head>
<body>
<button id="b1" type="button" name="btn[b1]">frei</button>
<button id="b2" type="button" name="btn[b2]">frei</button>
<button id="b3" type="button" name="btn[b3]">frei</button>
</body>
<script type="text/javascript">
function settext()
{
if (this.innerHTML == 'frei')
{
this.innerHTML = 'besetzt';
this.style.backgroundColor = '#FF0000';
this.style.color = '#FFFF50';
}
else
{
this.innerHTML = 'frei';
this.style.backgroundColor = '#00FF00';
this.style.color = '#000050';
}
return true;
}
document.getElementById('b1').addEventListener('click', settext, false);
document.getElementById('b2').addEventListener('click', settext, false);
document.getElementById('b3').addEventListener('click', settext, false);
</script>
</html>
Nun müsstest Du Dir für die spätere Auswertung auf dem Server noch ein paar Gedanken machen.
Grüße
TS
Gunnar Bittersmann
Auge
Matthias Apsel
robertroth