• Herzlich Willkommen!

    Nach der Schließung von inDiablo.de wurden die Inhalte und eure Accounts in dieses Forum konvertiert. Ihr könnt euch hier mit eurem alten Account weiterhin einloggen, müsst euch dafür allerdings über die "Passwort vergessen" Funktion ein neues Passwort setzen lassen.

    Solltet ihr keinen Zugriff mehr auf die mit eurem Account verknüpfte Emailadresse haben, so könnt ihr euch unter Angabe eures Accountnamens, eurer alten Emailadresse sowie eurer gewünschten neuen Emailadresse an einen Administrator wenden.

Javascript: Checkbox (Variablen Addition)

Pikachu

Diablo-Veteran
Registriert
28 Februar 2006
Beiträge
1.092
Hallo,
ich versuche mal wieder seit Wochen oder sogar Monaten etwas bestimmtes mit Javascript hinzubekommen, und zwar:

Ich habe zwei Textfelder, eine Checkbox und ein "OK"-Button. Die Werte die man in die beiden Textfelder eingibt werden addiert. Der Checkbox möchte ich einen bestimmten Wert geben und sie durch das Anharken der bisherigen Summe dazuzählen. Wenn die Checkbox nicht angeharkt ist soll der Wert der Checkbox auch nicht addiert werden.


Zum Beispiel:

Textfeld1 = 10
+
Textfeld2 = 10
+
(Aktivierte)Checkbox = 10
=
Ergebnis = 30




Hier ist mein bisheriger Quellcode:

<html>
<head>


<script type="text/javascript">

function input() {

var bb = 0;

if(document.getElementsByName("cb").checked = true)
{
bb = 100;
}

we=document.getElementById("we").value =
parseFloat(document.getElementById("ll").value)+
parseFloat(document.getElementById("ie").value)+bb;
}
</script>


</head>


<body>


<form name="allcbs">


<input type="button" value="OK" onclick="input();">


<table border="1">
<tr>
<td width="190">
<input type="text" id="ll" size="4" maxlength="2" value="0" onkeyup="input();">
</td>
</tr>

<tr>
<td>
<input type="text" id="ie" size="4" maxlength="3" value="0" onkeyup="input();">
</td>
</tr>

<tr>
<td>
<input type="checkbox" id="cb" onchange="input();">
</td>
</tr>
</table>



<input type="text" id="we" size="4" maxlength="3" value="0">


</form>


</body>
</html>
Zum Vergrößern anklicken....




Teilweise klappt der Code, aber halt auch nur teilweise. Die Checkbox wird leider IMMER addiert. Mit
"else if(document.getElementsByName("cb").checked = false)
{
bb = 0;
}"
habe ich es auch probiert.


Habe schon fast ganz Google abgesucht und es in diversen anderen Foren probiert. Klingt unglaubwürdig, ist aber so! :)

Ich weiß, dass hier ein paar Leute mit viel Ahnung sind, also hoffe ich, dass mir hier jemand helfen kann.

Danke für jede Mühe. :)
 
> if(document.getElementsByName("cb").checked = true)
Immer "true", weil "=" ein Zuweisungsoperator ist, es würde ein Vergleichsoperator benötigt, bzw:
if(document.getElementsByName("cb").checked)
 
Ah danke für deine Antwort.

Habe ich sofort ausprobiert, nu' geht aber nüx mehr. :)
 
Da ich keinen Plan von Java-Script habe(n möchte), mecker ich mal allgemein rum:

1. Keine Kommentare,
2. "we", "ll", "ii" und "bb" sind nicht aussagekräftig,
3. Zeile 9, Zuweisung mit Leerzeichen, Zeile 16 Zuweisung ohne und mit Leerzeichen?
 
Code: 
if(document.getElementsByName("cb").checked = true)

Wie Korrn schon richtig sagte, ist das "=" ein Zuweisungsoperator. Richtig wäre ein "=="

also:

Code: 
if(document.getElementsByName("cb").checked [COLOR="Red"]==[/COLOR] true)
 
Danke für eure Antworten.

"if(document.getElementsByName("cb").checked == true)"

Funktioniert leider nicht.
Die Werte der Textfelder werde zwar addiert, aber der Wert der Checkbox wird nicht addiert.
Was ist denn falsch? :(
 
ok, ich habe mich jetzt mal näher damit befasst.

Folgende Fehler gibt es sonst noch im Script:

1. es muss heißen:
Code: 
if(document.getElementsByName("cb")[COLOR="Red"][0][/COLOR].checked == true)

2. unten in der Checkbox-Definition muss es heißen:
Code: 
<input type="checkbox" [COLOR="Red"]name[/COLOR]="cb" onchange="input();">

Mit den Korrekturen funktioniert die Chose. Bitte das nächste Mal selbst im SELFHTML schlau machen...:rolleyes:
 
Also ich kenne mich mit Javascript nun so gar nicht aus, aber mir kommen beim bloßen Betrachten einige Zweifel.

Zum einen glaube ich, dass man "== true" in der Abfrage gar nicht braucht, weil schon "xxx.checked" einen boolschen Wert ergibt, der true oder false ist und das müsste eigentlich ausreichen. Aber == true sollte auch funktionieren.

Was ich viel interessanter finde, ist aber, dass du bei den einzelnen Feldern diverse Male die Funktion input aufrufst, beim OK-Button "onclick", bei anderen Felden auf "onkeyup" und bei der Checkbox bei "onchange". Das heißt für mich, dass die Funktion jedes mal aufgerufen wird, wenn eine der Bedingungen eintrifft, was ggf. zu völlig unsinigen Ergebnissen führen kann, weil ja noch lange nicht alles eingegeben wurde.

Zudem würde ich nicht den "Wert" der Variable bb davon abhängig machen, ob die Checkbox angeklickt wurde, sondern die Berechnung. Zumindest in deinem Fall hat ja bb immer den Wert 100 oder 0, so dass man sinngemäß auch folgendes schreiben könnte

bb = 100;

Result = wert1 + Wert2;

if (box.checked)
{
Result = Result + bb;
}


Was mir noch auffällt, ist, dass du we als input definierst, obwohl du es doch eigentlich berechnen willst.

Wie gesagt, ich nix Javascript, aber so auf den ersten Blick scheint da noch ein bisschen was schief zu sein.

/Edit: blödes Forum...
 
hab den fehler gefunden ;)
if(document.getElementById("cb").checked == true)
ist richtig du verwendest aber die methode "document.getElementsByName" aber deine checkbox hat nur ne id keine namen
bei mir gehts wenn ich das ausbesser

code:
<html>
<head>


<script type="text/javascript">

function input() {

var bb = 0;

if(document.getElementById("cb").checked == true)
{
bb = 100;
}

we=document.getElementById("we").value =
parseFloat(document.getElementById("ll").value)+
parseFloat(document.getElementById("ie").value)+bb;
}
</script>


</head>


<body>


<form name="allcbs">


<input type="button" value="OK" onclick="input();">


<table border="1">
<tr>
<td width="190">
<input type="text" id="ll" size="4" maxlength="2" value="0" onkeyup="input();">
</td>
</tr>

<tr>
<td>
<input type="text" id="ie" size="4" maxlength="3" value="0" onkeyup="input();">
</td>
</tr>

<tr>
<td>
<input type="checkbox" id="cb" onchange="input();">
</td>
</tr>
</table>



<input type="text" id="we" size="4" maxlength="3" value="0">


</form>


</body>
</html>
Zum Vergrößern anklicken....
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben