Wyjasnienie dziłania programu z uzyciem this w input

pytanie zadane 6 stycznia 2016 w JavaScript przez MlodyJavaS Użytkownik (500 p.)
edycja 6 stycznia 2016 przez MlodyJavaS

<script>
            function kolor(e){
                var blok = document.getElementById('blok');
                blok.style.backgroundColor=e.id;
				
				
            }

        </script>

<input id="green" type="radio" name="kolor" onchange="kolor(this) "> green
        <input id="blue" type="radio" name="kolor" onchange="kolor(this)"> blue
        

        
        <div id="blok" style="width: 200px; height: 100px; background-color: yellowgreen; position: fixed;
             left: 100px; top: 200px; "></div>

Moje pytanie jak wplywa na funkcje this z inputow tzn. jak jest on przekazywany do tej funkcji?

pozdrawiam :)

4 odpowiedzi

odpowiedź 6 stycznia 2016 przez Ivan Maniak (60,650 p.)

UŻYWAJ PRZYCISKU "CODE", BARDZO ON POMAGA. DZIEKUJE.

this, w funkcji oznacza po prostu TEN - ten element. Czyli element, który wykonuje daną funkcje.
Input ma funkcje, która wywołuje się po zmianie. this to nic innego jak getElementById/ClassName, tylko że jeżeli jest to ClassName to wtedy nie możemy dokładnie określić, który element został zmieniony, dlatego używa się this.

Ps. Lepiej nie używać Id, aby zmieniać koloru. Nie do tego służyć atrybut Id. Lepiej użyć jakiegoś customowego atrybutu, jeżeli jest to jakaś informacja, to w kodzie html dodaje się zazwyczaj coś w stylu data-color="red", a następnie w kodzie masz dostęp do tego atrybutu.