• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[FRAGE] Problem mit Auslesen und Addieren von Radio Buttons und Ergebnis Ausgabe

Abyla

New member
Hi,

falls mein Problem schon besteht sorry aber ich konnte es nirgendswo finden, einfach Link drunter posten und closen, danke.

Also zu meinem Problem:

Code:
<script type="text/javascript">
			var correctAnswers() = 0;
			
			function addCorrectanswer()
				{
						parseInt("correctAnswers"+"1");
				}
				
				
			function outputResult ()
				if(correctAnswers<10){
					document.write('text1');
				}
				if(correctAnswers<20){
					document.write('text2');
				}
				if(correctAnswers<27){
					document.write('text3');
				}
				else if(correctAnswers=27){
					document.write('text4');
				}
		</script>


Die Funktion, addCorrectanswer soll per onclick ausgeführt werden, wenn ein bestimmter Radio Button gedrückt wird.
Ein Beispiel meiner betreffenden Radio Buttons:
Code:
<input type=radio  name="quiz_vollständig_frage_27" value="richtig" onClick="addCorrectanswer()">Text<br>

Gedacht ist, das beim ausführen von addCorrectanswer, der Variable correctAnswers (die standardmässig 0 ist), der Wert 1 addiert wird und im Anschluss das Ergbeniss durch die Funktion outputResult ausgegeben wird, entsprechend dem Code.

Schon mal Danke im vorraus, hoffe Ihr könnt mir helfen :)
 
Du hast mehrere Syntaxfehler in der Fehlerkonsole:
  • correctAnswer ist erstens keine Funktion und zweites darf vor einem Funktionsaufruf natürlich kein "var" stehen - ergibt ja keinen Sinn...
  • der Funktionsblock muss in geschweiften Klammern stehen.

Dann hat dein Konstrukt mit dem parseInt keinerlei Effekt. Wenn du eine Variable ändern willst, musst du ihr schon etwas zuweisen. Du verwendest hier noch nicht einmal die Variable correctAnswer, sondern den String "correctAnswer", der mit ihr gar nicht korreliert ist. Der Code müsste wenn dann so aussehen:
Code:
correctAnswer += 1;
Aber deine ganze Idee funktioniert nicht so wirklich. Wenn ich zwei mal auf eine richtige Antwort klicke, bekomme ich zwei "Punkte". Daduch wird dein komplettes Wertungssystem unzuverlässig. Du musst dir da was besseres ausdenken. Auch ist eine globale Variable für sowas denkbar ungeeignet.

Zum Schluss noch ein Wort zu der outputResult()... document.write()... ist jetzt nicht dein Ernst. Das wird dir in diesem Zusammenhang nur Probleme bereiten. Vergiss' es einfach und verwende statt dessen .innerHTML.


Zu document.write:
http://www.w3.org/html/wg/drafts/html/CR/webappapis.html#dynamic-markup-insertion schrieb:
This method has very idiosyncratic behavior. In some cases, this method can affect the state of the HTML parser while the parser is running, resulting in a DOM that does not correspond to the source of the document (e.g. if the string written is the string "<plaintext>" or "<!--"). In other cases, the call can clear the current page first, as if document.open( ) had been called. In yet more cases, the method is simply ignored, or throws an exception. To make matters worse, the exact behavior of this method can in some cases be dependent on network latency, which can lead to failures that are very hard to debug. For all these reasons, use of this method is strongly discouraged.


Weil mir gerade etwas fad war, hab' ich mal was geschrieben, wie ich einen Quiz in JS programmiern würde. Fragen kann man hier sehr leicht austauschen/verändern/erweitern/hinzufügen.
Code:
<!DOCTYPE html>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Fenstertitel</title>
<style type="text/css"></style>
</head>
<body>
<h1>Quiz</h1>
<ol id="questions"></ol>
<button id="getPoints">auswerten</button>
<div id="output"></div>
<script type="text/javascript" src="//kkjs.kkapsner.de/modules/kkjs.load.js?modules=random"></script>
<script type="text/javascript">
(function(){
	var questions = [
		{
			question: "Wie heißt der Bürgermeister von Wesel?",
			answers: [
				{
					text: "Horst",
					points: -1
				},
				{
					text: "Willibald",
					points: 0
				},
				{
					text: "Esel",
					points: 1
				},
				{
					text: "Ulrike Westkamp",
					points: 100
				}
			]
		},
		{
			question: "E=?",
			answers: [
				{
					text: "mc²",
					points: 100
				},
				{
					text: "1/2*m*v²",
					points: 100
				},
				{
					text: "h\u03BD",
					points: 100
				},
				{
					text: "mir doch egal",
					points: -10
				},
				{
					text: "5. Buchstabe im Alphabet",
					points: 10
				}
			],
			multiple: true
		}
	];
	var questionsOl = kkjs.$("questions");
	var questionPointFunctions = [];
	questions.forEach(function(q, qIdx){
		var answerPointFunctions = [];
		kkjs.node.create({
			tag: "li",
			className: "question",
			childNodes: [
				{
					tag: "h2",
					childNodes: [q.question]
				},
				{
					tag: "ol",
					childNodes: kkjs.random.array.shuffle(q.answers).map(function(a){
						var input = kkjs.node.create({
							tag: "input",
							type: q.multiple? "checkbox": "radio",
							name: "question" + qIdx
						});
						answerPointFunctions.push(function(){
							return input.checked? a.points: 0;
						});
						return kkjs.node.create({
							tag: "li",
							className: "answer",
							childNodes: [{
								tag: "label",
								childNodes: [
									input,
									a.text
								],
							}]
						});
					})
				}
			],
			parentNode: questionsOl
		});
		questionPointFunctions.push({
			getPoints: function(){
				return answerPointFunctions.reduce(function(v, a){
					return v + a();
				}, 0);
			},
			getMaximalPoints: function(){
				if (q.multiple){
					return q.answers.reduce(function(v, a){return v + (a.points > 0? a.points: 0);}, 0);
				}
				else {
					return q.answers.reduce(function(v, a){return Math.max(v, a.points);}, 0);
				}
			}
		});
	});
	kkjs.event.add(kkjs.$("getPoints"), "click", function(){
		var points = questionPointFunctions.reduce(function(v, q){return v + q.getPoints();}, 0);
		var maxPoints = questionPointFunctions.reduce(function(v, q){return v + q.getMaximalPoints();}, 0);
		kkjs.$("output").innerHTML = kkjs.sprintf("%d / %d (%d%%)", points, maxPoints, points/maxPoints*100);
	});
}());
</script>
</body>
</html>
- musst du jetz nicht verstehen. Wollte dir nur zeigen, was mit relativ wenig Aufwand (sind jetzt nur ca. 110 Zeilen JS und fast die Hälfte ist die Definition der Fragen) machbar ist.
 
hmm ok, dein Code funktioniert bei mir irgendwie nicht, trotzdem hast du mich beim durchlesen irgendwie auf eine Idee gebracht (obwohl ich nur die Hälfte bisher verstehe) und mit der Zeile
Code:
correctAnswer += 1;
läufts sogar

die document.write hab ich jetzt durch display und dann none oder block ersetzt bzw. will das noch lauffähig kriegen...

das problem, was du meintest, das ich bei dem mehrmaligen drücken eines richtigen radio buttons bekommen könnte versuche ich jetzt mit deaktivieren der selbigen zu verhindern (hätt ich depp auch so drauf kommen können)...

bin halt noch anfänger :D wenn ichs hinkriege post ichs nochma hierdrunter bis hierhin schonmal danke :)
 
dein Code funktioniert bei mir irgendwie nicht
Das ist komisch. Steht bei dir da irgendwas in der Fehlerkonsole?

obwohl ich nur die Hälfte bisher verstehe
Das kommt mit der Zeit.
hab ich jetzt durch display und dann none oder block ersetzt
Damit kann man es natürlich auch machen.

bin halt noch anfänger
War jeder mal.

wenn ichs hinkriege post ichs nochma hierdrunter
Sehr gut.

bis hierhin schonmal danke
Bitte - gern geschehen.
 
nicht viel, nur das hir steht drin:

Code:
file://kkjs.kkapsner.de/modules/kkjs.load.js?modules=random 
Failed to load resource: net::ERR_FILE_NOT_FOUND

new%20%201.html:66 Uncaught ReferenceError: kkjs is not defined
new%20%201.html:66 (anonymous function)
new%20%201.html:126 (anonymous function)
 
Ah - ich dachte mir schon, dass das wahrscheinlich an meinem Framework liegt.
Das kann natürlich nicht über das file-Protokoll gelesen werden. Wenn du die Seite über einen lokalen Webserver, den du sowieso aufsetzen solltest, wenn du irgendwas für's Netz testest/entwickelst, lädst, sollte es funktionieren.

Alternativ kannst du natürlich das http-Protokoll auch explizit in den Quelltext reinschreiben...
 
Zurück
Oben