html / javascript zu einem Punkt im Code springen

Dave Gast #5434297
Lesenswert?
• ▲
▼ 
Hallo,

ich versuche gerade in html einen Text (in der selben html) nachdem ein 
Button gedrückt wurde.

Habe viel gegoogelt, aber ich komme nicht so wirklich auf den richtigen 
Weg.

Wie könnte sowas funktionieren?


1
<script language="javascript" type="text/javascript">

2
function button_click(id) {

3
  if (document.getElementById(id).checked == true) {

4
    alert ( id );

5
  } else {

6
    alert ( id );

7
  }

8
}

9


10
</script>

11


12
<input type="radio" name="button" id="button1" value="" onclick="button_click(this.id)" /> button1

13
<br />

14
<input type="radio" name="button" id="button2" value="" onclick="button_click(this.id)" /> button2

15


16


17


18


19
<div class="button1_used">

20
  <p>dieser text wird angezeigt erst nachdem button1 gedückt wurde</p>

21
</div>

22


23
<div class="button1_used">

24
  <p>und dieser text erst nach drücken button2</p>

25
</div>
Antwort Zitieren Bearbeiten Thread verschieben Thread sperren Anmeldepflicht aktivieren Anpinnen Thread löschen Thread mit anderem zusammenführen Beitrag melden
Joachim S. #5434453
Lesenswert?
• ▲
▼ 
Dave schrieb:
> ich versuche gerade in html einen Text (in der selben html) nachdem ein
> Button gedrückt wurde.

Mir ist nicht 100%ig klar, was genau Du willst - kann es sein, dass in 
dem Satz was fehlt?

Der gezeigte Code wird jedenfalls höchstwahrscheinlich nicht das machen, 
was Du willst. Falls Du willst, dass die beiden <div>-Element einfach 
erst dann angezeigt werden/sichtbar sind, wenn die entsprechenden 
Radio-Buttons ausgewählt sind, dann kannst Du das per
element.setAttribute("hidden", true/false);
erreichen. (Bitte nicht 1:1 so abtippen, das klappt natürlich nicht)
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Dave Gast #5434581
Lesenswert?
• ▲
▼ 
Ja, da fehlte der halbe Satz. Sorry

Ich bin jetzt ein stückchen weiter, aber noch nicht ganz so wie ich das 
gerne möchte.

1
<!DOCTYPE html>

2
<html>

3
<body>

4


5
<button type="button" onclick="MyFunction1()">button1</button>

6
<button type="button" onclick="MyFunction2()">button2</button>

7


8
<p id="show1">This is 1.</p>

9
<p id="show2">This is 2</p>

10


11


12
<script>

13


14
function MyFunction1() {

15
    document.getElementById("show2").style.visibility = "hidden";

16
    document.getElementById("show1").style.visibility = "visible";

17
}

18


19
function MyFunction2() {

20
    document.getElementById("show1").style.visibility = "hidden";

21
    document.getElementById("show2").style.visibility = "visible";

22
}

23
</script>

24


25
</body>

26
</html>


So wird das zwar ein und ausgeblendet, geht das auch ohne den leeren 
Platzhalter?
Also das die beiden Elemente quasi aufeinander liegen?

Wenn in z.B.: show1 ein langer text mit absätzen ist, dann habe ich 
jetzt eine Bildschirmgröße ein leeres Bild un muss erst runterscrollen 
das ich show2 sehen kann
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Minimalist Gast #5434607
Lesenswert?
• ▲
▼ 
Dann änder halt nicht die Eigenschaft visibility, sondern Display.

1
function MyFunction1() {

2
    document.getElementById("show2").style.display= "none";

3
    document.getElementById("show1").style.visibility = "inline-block";

4
}
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Thread beobachten

Antwort schreiben

Bitte melde dich an, um einen Beitrag zu schreiben.

Bestehender Account

oder

Mit Google-Account einloggen

Noch kein Account?

Die Registrierung ist kostenlos und dauert nur eine Minute.

Jetzt registrieren