Forum: PC-Programmierung html / javascript zu einem Punkt im Code springen


html / javascript zu einem Punkt im Code springen
von Dave (Gast)

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>


  


  




  

    Beitrag melden Bearbeiten Thread verschieben Thread sperren Anmeldepflicht aktivieren Anpinnen Thread löschen Thread mit anderem zusammenführen Markierten Text zitieren Antwort Antwort mit Zitat
  







      

      



  

    Re: html / javascript zu einem Punkt im Code springen
  


  

    

      von
      
        Joachim S.
        (oyo)
        
      
      


      
    


    

      
    

    

    

  
  


  

  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)

  


  




  

    Beitrag melden Bearbeiten Löschen Markierten Text zitieren Antwort Antwort mit Zitat
  







      

      



  

    Re: html / javascript zu einem Punkt im Code springen
  


  

    

      von
      
        Georg M.
        (g_m)
        
      
      


      
    


    

      
    

    

    

  
  


  

  Lesenswert?
  

  •
  
  ▲  
  

  ▼  
  		
  

  


  

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

https://www.w3schools.com/jsref/prop_html_innerhtml.asp

https://www.w3schools.com/jsref/prop_style_visibility.asp

  


  




  

    Beitrag melden Bearbeiten Löschen Markierten Text zitieren Antwort Antwort mit Zitat
  







      

      



  

    Re: html / javascript zu einem Punkt im Code springen
  


  

    

      von
      
        Dave (Gast)
      
      


      
    


    

      
    

    

    

  
  


  

  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

  


  




  

    Beitrag melden Bearbeiten Löschen Markierten Text zitieren Antwort Antwort mit Zitat
  







      

      



  

    Re: html / javascript zu einem Punkt im Code springen
  


  

    

      von
      
        Minimalist (Gast)
      
      


      
    


    

      
    

    

    

  
  


  

  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
}


  


  




  

    Beitrag melden Bearbeiten Löschen Markierten Text zitieren Antwort Antwort mit Zitat
  







      

      



  

    Re: html / javascript zu einem Punkt im Code springen
  


  

    

      von
      
        Daniel A.
        (daniel-a)
        
      
      


      
    


    

      
    

    

    

  
  


  

  Lesenswert?
  

  •
  
  ▲  
  

  ▼  
  		
  

  


  

      
Ich setze und entferne in der Regel mit JS eine css class, und mache die 
style Änderungen dann mit css:
https://jsfiddle.net/vj6x2apj/

Aber es ist immer gut, js optional zu machen. Hier kann man das auch mit 
reinem HTML und CSS lösen:
https://jsfiddle.net/rpw1tq96/

  


  




  

    Beitrag melden Bearbeiten Löschen Markierten Text zitieren Antwort Antwort mit Zitat
  








    

    

       Thread beobachten

      |
         Seitenaufteilung abschalten

    

        


Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.



  Bestehender Account

  


  
  

  
    

      

        
          
        
        
          
        
      

      

        
          
        
        
          
        
      

    


    
    
    





  Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!

  Mit Google-Account einloggen
  





  Noch kein Account? Hier anmelden.