• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

javascript window.onload style

VPS Starter Arubacloud
0 głosów
477 wizyt
pytanie zadane 27 stycznia 2019 w JavaScript przez Próbny Nowicjusz (200 p.)

Witam, mam problem :

Za pomocą js (window.onload = function())  nadałem różne kolory tła wszystkim komórkom tabeli zależnie od ich zawartości. Potem za pomocą onclick na przycisku uruchamiam inną funkcję która powinna zmieniać kolor danych komórek na inny. Kolor nie zmienia się. Zauważyłem że funkcja z onclick może ustawić kolor ale nie może go zmienić po ustawieniu go przez funkcję z onload. Poniżej cały (według mnie) potrzebny kod. Pytanie to czemu tak się dzieje i jak sprawić by funkcja wywołana przez onclick działała poprawnie.

function funkcja()
{for(var i = 3; i < 20; ++i)
	{
		for(var j = 0; j <=2; ++j)
		{
	
			var list = document.getElementsByTagName("TR")[i];
					  
			var x = list.getElementsByTagName("TD")[j].innerHTML;
			
			if(przeslanaWartosc  == x) 
			{
			document.getElementsByTagName("tr")[i].style.backgroundColor = "green";	
			}
		}
	}

}

window.onload = function()
{			
		for(var i = 3; i < 20; ++i)
			{
				for(var j = 0; j < 25; ++j)
				{
					var list = document.getElementsByTagName("TR")[i];
					
					var x = list.getElementsByTagName("TD")[j].innerHTML;
					
					if(x <= 18) list.getElementsByTagName("TD")[j].style.backgroundColor = "lightblue";
					if(18<x && 25>x) list.getElementsByTagName("TD")[j].style.backgroundColor = "#00FF00";
					if(24<x && 30>x) list.getElementsByTagName("TD")[j].style.backgroundColor = "yellow";
					if(30<=x && 39>=x) list.getElementsByTagName("TD")[j].style.backgroundColor = "orange";
					if(40<=x && 42>=x) list.getElementsByTagName("TD")[j].style.backgroundColor = "red";
				}
			}
}

  

1 odpowiedź

+1 głos
odpowiedź 27 stycznia 2019 przez kenjiro244 Dyskutant (8,600 p.)

1. Warto zacząć stosować addEventListener zamiast onload in onclick

2. Kiedy pobierasz na początku nie musisz tworzyć 2 pętli choć jest to jakieś rozwiązanie. Lepiej może by było pobrać wszystkie komórki TD i dla nich wykonać pętlę w której zmienisz ich kolor w zależności od wartości w niej.

3. Nazwa funkcji funkcja nie jest zbyt ciekawa ;)

4. W celu zmiany kliknięcia na daną komórkę wykorzystaj Event delegation czyli dodaj event dla całej tabeli a potem w funkcji sprawdź czy kliknąłeś w komórkę i zmień jej kolor.

 

komentarz 1 lutego 2019 przez Próbny Nowicjusz (200 p.)
Dzięki za radę, skorzystam z niej ale nadal nie wiem czemu występuje problem który opisałem. Nie chcę tak po prostu odrzucać jednej metody bo "podobno inna jest lepsza"
komentarz 1 lutego 2019 przez kenjiro244 Dyskutant (8,600 p.)

Ale to nie działa przez to że wybrałeś coś innego tylko zrobiłeś źle :D. Jeżeli funkcja funkcja jest odpalana po kliknięciu na daną komórkę to

1. Druga pętla for jest mniejsza niż ta która wypełnia komórki na początku.

2. Na początku wybierasz cały rząd wstawiasz do zmiennej list, potem do zmiennej x wstawiasz wartość jaka jest w komórce,.

No i to kolejny problem nie wiadomo co to jest ta przesłana wartość. No i potem jeżeli jest równe wybierasz jeden rząd i nadajesz mu kolor. strasznie jest tutaj wszystko namieszane. Chociażby zmienna list powinna być zadeklarowana przed 2 pętlą bo w przeciwnym razie na początku z 20 wymaganych razy zmieniasz ją 500 razy.

"podobno inna jest lepsza"

Ok twój wybór ale lepiej zacząć stosować od początku rozwiązania które są poprawne. Jeżeli będziesz robił coś więcej to im wcześniej zaczniesz korzystać z poprawnych rozwiązań tym lepiej. Jak dla mniej mniej nauki to tylko plus.

Podobne pytania

0 głosów
1 odpowiedź 433 wizyt
pytanie zadane 25 stycznia 2021 w JavaScript przez Mlorism Użytkownik (580 p.)
0 głosów
2 odpowiedzi 54 wizyt
pytanie zadane 12 lutego w JavaScript przez niezalogowany
0 głosów
2 odpowiedzi 363 wizyt

92,454 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...