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

Hinweis: der ursprüngliche Beitrag ist mehr als 6 Monate alt. Bitte hier nur auf die ursprüngliche Frage antworten, für neue Fragen einen neuen Beitrag erstellen.

Formatierung
  • [c]C-Code[/c]
  • [code]Code in anderen Sprachen, ASCII-Zeichnungen[/code]
  • [math]Formel in LaTeX-Syntax[/math]
  • [[Titel]] – Link zu einem Artikel
  • Verweis auf einen anderen Beitrag: Rechtsklick auf dessen Beitrags-ID (#8078628), „Adresse kopieren“, in den Text einfügen

Mehr zur Formatierung

Längeren Sourcecode als Anhang, nicht in den Text. JPG nur für Fotos und Scans; Zeichnungen und Screenshots als PNG oder GIF. Siehe Bildformate.

Dein Name und deine E-Mail-Adresse

Schon registriert? Anmelden

Wird nicht angezeigt. Wir schicken dir einen Link; sobald du damit bestätigst, erscheint dein Beitrag.

Mit dem Abschicken legst du einen kostenlosen Account an und erkennst die Nutzungsbedingungen und die Datenschutzerklärung an.