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

Javascript - Radio-Buttons

Status
Für weitere Antworten geschlossen.
Basti93

Basti93

Blogger
Guten Tag.

Bevor ich anfange, mein Problem zu beschreiben, hier erst einmal der gegebene Code:

Code: 
<html>
<head>
<title>Test</title>
</head>
<body>
<!-- Stichwortsuche - Start -->
<p><script language="JavaScript" src="stichwort.js" type="text/javascript"></script>
<input type="text" value="" id="dwid" size="35" maxlenght="10"/>
<input type="submit" value="Los!" onclick="stichwort()"/><br>
O1: <input type="radio" name="o" value="o1" checked="checked">
O2: <input type="radio" name="o" value="o2">
O3: <input type="radio" name="o" value="o3" >
</p>
<!-- Stichwortsuche - Ende -->
</body>
</html>
Und:
Code: 
<!--
var ids = Array("test1", "test2");

function stichwort()  {
eingabe = document.getElementById("dwid").value;
    for (i=0;i < ids.length;i++) {
            if (eingabe == ids[i]) {location.href = "st-"+ids[i]+".html";
                return; }
    }
        location.href = "unstichwort.html";
}
//-->
Wie ihr seht wird, wenn man auf den Button "Los!" klickt, die Datei st-EINGABE.html geladen. Ich möchte das so haben, dass - je nach dem welcher Radio-Button ausgewählt ist - ein anderer Teil vor die EINGABE gesetzt wird. Also wenn man z.B. den Radio-Button o2 ausgewählt hat:
te-EINGABE.html

Falls es noch nicht ganz klar ist:

Wenn man momentan etwas in das Textfeld eingibt und dann auf Los! klickt, wird die Seite st-EINGABE.html geladen. Ich möchte nun, dass man mit Hilfe der Radio-Buttons auswählen kann, was vor der Eingabe steht.

Also statt st- zum Beispiel o2: te-EINGABE.html

Könnt ihr mir dabei weiterhelfen?

Danke schon mal im voraus!
 
Man kann sich prima Strukturen für solche Aufgaben aufbauen:
Code: 
var locations = {
   o1 : "foo.html",
   o2 : "bar.html",
   o3 : "blubb.html"
   // usw:
};

var radios = document.getElementsByName("o");
for (var i = 0, radio; radio = radios[i]; i++) {
    if (radio.checked) {
        location = locations[radio.value]; // ggf. Überprüfung ob es den "Key" gibt
        break;
    }
}
 
Kleine Bitte:

Könnte jemand dieses Sytem in meinen Code einbauen (siehe oben),
damit ich das mal ausprobieren kann?

Danke schon mal im voraus!
 
Und was ist mit selber denken? Viel musste da nicht mehr herumgebaut werden:
Code: 
addEvent(window, "load", function () {
    var locations = {
       o1 : "foo.html",
       o2 : "bar.html",
       o3 : "blubb.html"
       // usw:
    };
    var eingabe = document.getElementById("dwid");
    var radios = document.getElementsByName("o");
    var submit = document.getElementById("submit");

    addEvent(submit, "click", function (evt) {
        for (var i = 0, radio; radio = radios[i]; i++) {
            if (radio.checked && eingabe.value == radio.value && typeof locations[radio.value] != "undefined") {
                location = locations[radio.value];
                break;
            }
        }
        evt.preventDefault();
    });
});
Unter Verwendung von addEvent()
 
OK, dann stelle ich mal die Frage anders:

Wie kann ich in den nachfolgendem Code ungefähr so etwas setzen:

Das was vor die Eingabe gesetzt wird ist die Variable te.
Je nachdem welcher Radio-Button ausgewählt ist, ist die Variable anders.
Also vielleicht etwas mit if, else?

Code: 
<html>
<head>
<title>Test</title>
<script>
<!--
var ids = Array("test", "test2");

function stichwort()  {
eingabe = document.getElementById("dwid").value;
    for (i=0;i < ids.length;i++) {
            if (eingabe == ids[i]) {location.href = ids[i]+".html";
                return; }
    }
        location.href = "unstichwort.html";
}
//-->
</script>
</head>
<body>
<!-- Stichwortsuche - Start -->
<p><script language="JavaScript" src="stichwort.js" type="text/javascript"></script>
<input type="text" value="" id="dwid" size="35" maxlenght="10"/>
<input type="submit" value="Los!" onclick="stichwort()"/><br>
O1: <input type="radio" name="o" value="o1" checked="checked">
O2: <input type="radio" name="o" value="o2">
O3: <input type="radio" name="o" value="o3" >
</p>
<!-- Stichwortsuche - Ende -->
</body>
</html>
Also, wie muss ich die entsprechende Variable schreiben und was muss sich bei dem if-Teil beachten, damit das Ergebnis im Zusammenhang mit den Radio-Buttons steht?
 
Über deinem Post steht ein kompletter Code, der zwar ungetestet ist, aber genau das macht was du willst. Du musst ihn nur verstehen.
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben