Kurs JavaScript odc. 2: Mechanika działania skryptów: uchwyty, funkcje, zdarzenia
ฝัง
- เผยแพร่เมื่อ 19 ก.ย. 2024
- Jeżeli masz ochotę zobaczyć więcej naszych filmów, podcastów i artykułów w coraz lepszej jakości, to zachęcamy do pozostawienia subskrypcji, a także do odwiedzenia prowadzonych przez nas witryn oraz do polubienia fanpage'u Pasji informatyki na Facebooku.
🔔 Subskrybuj - bit.ly/pasja-sub
Jeśli masz ochotę wesprzeć to co robimy, to możesz:
🖐 Zostać Patronem - patronite.pl/p...
☕️ Ufundować nam wirtualną kawę - buycoffee.to/p...
👉 Fanpage na Facebooku - bit.ly/pasja-fb
👉 Profil Patronite - patronite.pl/p...
👉 Lista Patronów - pasja-informaty...
👉 Donacje na blogu - miroslawzelent....
👉 Harmonogram publikacji - bit.ly/pasja-ha...
👉 Kontakt z nami - pasja-informaty...
👉 Współpraca reklamowa - bit.ly/pasja-ws...
👉 Kursy video dla technikum - pasja-informaty...
👉 Blog informatyczny - miroslawzelent.pl
👉 Trenażer egzaminacyjny - egzamin-informa...
👉 Egzamin-E13.pl - egzamin-e13.pl
👉 Forum dyskusyjne - forum.pasja-in...
👉 Witryna podcastowa - podcast.pasja-i...
👉 Twitter MZ - / miroslawzelent
👉 Twitter DS - / stelmach_damian
Pora najwyższa na drugi odcinek kursu JavaScript. W odcinku tym uporządkujemy naszą wiedzę na temat mechaniki działania czystego kodu js. Dziś uzyskamy fundamentalne zrozumienie logiki, którą podszyty jest każdy skrypt js. To jest bardzo cenna wiedza; taka, która pozwoli nam już po tym odcinku dużo swobodniej analizować nawet złożone skrypty - takie, które może do tej pory podpinaliśmy jako gotowiec do swojej strony, nie będąc jednak w stanie zrozumieć jak działają.
💾 POBIERZ PLIKI Z ODCINKA:
miroslawzelent....
📑 CODE REVIEW NA FORUM:
bit.ly/code-rev...
🎵 MUZYKA:
Sex Whales - Poor Bird: • Video
A Creative Commons Attribution License (CC BY) states that the material can be shared, remixed and used commercially (bit.ly/CCAttrib....
Release: / poor-bird
License: bit.ly/CCAttrib...
Muzyka z podsumowania:
Crimson Fly - Huma-Huma: • Video
#pasjainformatyki #programowanie #kursjavascript
W pierwszym zadaniu, w momencie sprawdzania czy liczba jest równa zeru, wystarczy zero ubrać w cudzysłów, wtedy napis zero wyświetli się tylko po wpisaniu wartości "0", a puste pole zastosuje się do ostatniej instrukcji else, czyli poprosi nas o podanie liczby :) Dzieje się tak dlatego, ponieważ wartość zerowa oraz brak wartości odbierane są w ten sam sposób, w końcu zero to brak czegokolwiek, ale jeśli przy porównaniu ubierzemy nasze zero w cudzysłów, zostanie ono potraktowane jako łańcuch tekstu i tylko identyczny łańcuch tekstu wywoła instrukcję dla tego zdarzenia :) Obrazując: "0" == "0", lecz "0"=/=" ", a 0=="0" oraz 0==" ". Niby nie jest to jakieś super trudne, ale poczułem się jak geniusz, że rozkminiłem to w tak banalny sposób, więc poczułem potrzebę podzielenia się. Mam nadzieję, że ktoś kto tego nie wyłapał, teraz zrozumie co i jak :D
Ktoś złośliwy mógłby wpisać 00 i stwierdzić, że nie działa.
Racja, mógłby, chyba że mamy zrobioną instrukcję, że jak jest zero i chcesz je wpisać drugi raz, to zostaje tylko jedno ;)
Jak ktoś wpisze dwa czy jakąkolwiek liczbę zer to będzie pisać zero natomiast jak napiszemy else if (liczba =="0") to wtedy jak napiszemy jakąkolwiek liczbę zer to będzie wtedy pisać że to nie jest liczba.
Dobre, ale... :) jeżeli wpiszemy np. [spacje] 2, to będzie wynik dodatni, ale przy zerze w cudzysłowie [spacje] 0 da nam odpowiedź, że to nie jest liczba. Jak sobie poradzić w takim przypadku? ps. spacja jedna lub więcej.
warunek liczba.length === 0 przed liczba == 0 i prawie jest ok... prawie, bo same spacje też dają wynik 0, a powinno być: to nie jest liczba :D ... już mam:
warunek (dlugosc === 0 || dlugosc === spacje) przed (liczba == 0) i już. Można wstawiać spacje przed i po zerze, oraz same spacje i zawsze poda poprawny wynik. ps. var spacje = liczba.split(' ').length - 1; znalezione na: stackoverflow.com/questions/35849174/count-spaces-in-a-string
Zad 1
ja zrobiłem to tak:
else if (liczba=="") document.getElementById("wynik").innerHTML="Napisz liczbę w puste pole";
i wrzuciłem nad warunkiem z liczba==0
. Działa :)
W pierwszym zadaniu, najłatwiejszym sposobem jest zmiana na . Nie będzie się wtedy dało wpisać czegokolwiek, co nie jest liczbą, a przy okazji nie będziemy musieli dokładać kolejnej linijki kodu.
Dokładnie tak samo podszedłem do zadania, nie ma jak oszukać ;)
Jest to dobre rozwiązanie, aczkolwiek ma swoje minusy. Najlepiej jest rozwiązywać takie sprawy w obu miejscach: czyli tak w htmlu jak i javascripcie równocześnie. Wtedy jest mniejsza szansa, że coś pójdzie nie tak.
Człowieku,powiem Ci jedno.
Bardzo dobra robota !
***** Mam pytanie. Robię taką galerię jako tło strony i dam tam zdjęcia w wysokich rozdzielczościach by dodatkowo dać efekt przesuwania się w lewo tego obrazu. Jak wykonać taki efekt? Czy są już jakieś gotowe pluginy jquery do tego?
***** Mam pytanie, czy będzie odcinek o walidacji formularzy rejestracji w javascript? Tak, że po wpisaniu nieodpowiedniego loginu od razu podświetla się formularz na czerwono i uniemożliwia przejście dalej? Będzie w ogóle film o rejestracji .php? Jeśli tak to kiedy będą te odcinki? Przepraszam za zachłanność na Pana filmiki ale realizuję swój pierwszy projekt i termin goni :) Pozdrawiam
On ci nigdy nie odpisze
@@Iwillownyouandbehappy i jak tam pracujesz aktualnie w dziale IT
Jestem wręcz zszokowany jak wielką wiedze pan posiada, i jestem bardzo wdzięczny, że poświeca pan swój czas tworzenie takich odcinków, jest pan moim mistrzem. Serdecznie dziękuje!
18:32 wystarczy zamienić typ input na liczbę po czym otrzymamy: gdzie przeglądarka blokuje pisanie liter i znaków oraz innych wartości które nie są złożone z cyfr :)
Ale da się wstawić literę E jako cyfrę. Domyślam się że ma to związek z bardzo dużymi liczbami gdzie E to zapewne jakiś wykładnik czy coś w tym stylu. Zaawansowana matematyka o której nie mówi się za dużo na szczeblu poniżej szkoły średniej :)
@@andrzejwasilczuk6323 Literki od A do F są używane w systemie heksadecymalnym (szesnastkowym) gdzie A=10 i każda kolejna literka jest o 1 większa (największa , czyli F=15)... czyli można chyba powiedzieć że literki od A do F to też cyferki
Witam Panie Mirosławie, zainspirował mnie Pan, żeby wkońcu zmierzyć się z min. HTML-em czy też C++. Dziękuje za to co Pan robi i powodzenia ! Wszystkiego dobrego !
Pytanko: W związku z tym, że ten materiał ma dziś już 7 lat to jedna istotna rzecz się zmieniła. Na stronie jQuery w zakładce download nie ma podanych tych linii w tagach do skopiowania. Przepisałem sobie oczywiście z "palca" linię z video, jednak przypuszczam że na dzień dzisiejszy nie jest to rozwiązanie zgodne ze sztuką. Moje pytanie brzmi jak zgodnie ze sztuką dzisisja podpinać jQuery?
@przemekkrawczynski8477
I jak tam Przemek udało Ci się dojść do rozwiązania jak to zrobić w 2023 roku z jQuery? Daj znać lub ktoś inny proszę daj znać :)
Pewnie już wiesz ale może innych zaciekawi, wchodzisz na jQuery npm i kopiujesz skrypt który wklejasz nad skryptem z js. ;)
Zadanie #3 - Slider wydaje się działać poprawnie po uwzględnieniu w kodzie poniższych poprawek:
var timer1 = 0;
var timer2 = 0;
var timer3 = 0; // utworzenie nowej zmiennej do identyfikacji timera w funkcji ustawslajd()
function ustawslajd(nrslajdu)
{
clearTimeout(timer1);
clearTimeout(timer2);
numer = nrslajdu - 1;
schowaj();
timer3 = setTimeout("zmienslajd()", 500);
// przyporządkowanie zmiennej timer3 do setTimeout()
}
function schowaj()
{
$("#slider").stop();
// zatrzymanie bieżącego efektu slidera przed wywołaniem fadeOut()
$("#slider").fadeOut(500);
}
function zmienslajd()
{
clearTimeout(timer3); // przerwanie odliczania timera 3
numer++; if (numer>5) numer=1;
var plik = "";
document.getElementById("slider").innerHTML = plik;
$("#slider").fadeIn(500);
timer1 = setTimeout("zmienslajd()", 5000);
timer2 = setTimeout("schowaj()", 4500);
}
var timer1 = 0;
var timer2 = 0;
var timer3 = 0;
function ustawSlajd(nrSlajdu) {
clearTimeout(timer1);
clearTimeout(timer2);
numerSlajdu = nrSlajdu - 1;
schowaj();
//przerwanie funkcji schowaj()
clearTimeout(timer3);
setTimeout("zmienSlajd()", 500);
}
function schowaj() {
timer3 = $("#slider").fadeOut(250);
}
function zmienSlajd() {
numerSlajdu++;
if (numerSlajdu > 5) numerSlajdu = 1;
var plik = '';
document.getElementById("slider").innerHTML = plik;
$("#slider").fadeIn(1500);
timer1 = setTimeout("zmienSlajd()", 5000);
timer2 = setTimeout("schowaj()", 4750);
}
Zadanie #1
Przed warunkiem sprawdzającym czy liczba == 0, należy umieścić kolejny warunek: else if (liczba == "")
Dobrze jest wiedzieć, że wrzuca Pan nowe tutoriale. Na razie jestem na etapie C++, ale mam zamiar przebrnąć przez wszystkie kursy. Świetny materiał do nauki.
Dziękuję i pozdrawiam.
Dziękuję pięknie za film. Zadanie #1
Spowolniłem film do 0.5 bo nie nadążałem klepać linijek
Polecam sprawdzić jak Pan Mirosław brzmi po 0.5 :D
Hahaha coś pięknego :D A przeskocz z tego do 1.25, wtedy się dopiero uśmiałem xD
Ja dałem sobie 1.5, bo Pan Mirosław nie nadążał klepać za mną. Też ciekawie brzmi
Dobre
Xdd
2*
Panie Mirosławie, pan jest MEGAAA :D Mam 13 lat, a umiem już pisać strone w oparciu o HTML, CSS i JS :D Dziękuje i oby więcej takich filmów ;D
+Fracek8kPlay Ja również -,- nie ma czym się chwalić na razie.
I jak życie? ;D
Moja propozycja do zadania #1 - sprawdz dlugosc ciagu znakow wpisanego przez uzytkownika. Wpisanie zera zwraca wartosc funkcji length = 1, puste pole zwraca 0:
else if(liczba == 0 && liczba.length != 0)
{
document.getElementById("wynik").innerHTML = "zero";
}
Jest Pan Wielki dziękuję,że Pan dzieli się tą wartościową wiedzą...🌟👍🍀✅
Pana odcinki są doskonałe. Dzię ki wszystkim tych kursów zainteresowało mnie programowanie i stało się to moim hobby! Czekam na więcej materiałów na temat programowania!
Wielkie Dzięki Za przystępne wytłumaczenie. Podobało mi się świetne tłumaczenie uchwytu. Oraz cytat "i co jajco". Jest już późno więc jutro przerobie jeszcze raz informacje na spokojnie z tego nagrania. Jeszcze raz dzięki pozdro
Świetnie Pan prowadzi ten wykład. Nie jąka się Pan jak lektorzy innych kursów JS dostępnych na TH-cam. Widać ,że świetnie się Pan orientuje w tematyce. Kurs godny polecenia! Proszę o więcej!
Świetne poradniki :) Idealne dla przypomnienia i utrwalenia wiadomości
Niesamowity kurs na wstęp do programowania w JavaScript! Dzięki 👍⚡
Jeżeli chodzi o zapisywanie ścieżki do obrazka w zmiennej, to łatwym omienięciem problemu z cudzysłowiem, jest użycie w jego miejsce apostrofu.
var new_pic = "";
Chwała ci za to ! po 2 latach twój kom potrafił pomóc :DD
Jedyne czego się dopatrzyłem (jak na razie) w 3 zadaniu to to, że timer wywołujący funkcję "zmienslajd" nie jest przerywany i przez to klikając na kilka slajdów szybko, mozna zrobić dyskotekę :D
po prostu, dziękować...:)
Jeśli nasza funkcja ma rozpoznawać czy pole jest puste należy zastosować takie kod
function sprawdz()
{
var liczba = document.getElementById("pole").value;
if (liczba.length
Wystarczy ubrać zero w cudzysłów przy porównaniu ;) Wtedy tylko identyczny łańcuch tekstu wypisze na ekranie "zero" :D
Fakt, skrypt kolegi wyżej jest pewniejszy
Tylko że... 00 to nie jest liczba. Oba rozwiązania bardzo sprytne.
Działa! To jest dobre rozwiązanie. Natomiast nie trzeba dodawać nawiasów klamrowych przy czterech ostatnich warunkach.
Wydaje mi się, że wciąż będzie problem z łańcuchem złożonym ze spacji i zera. Moim zdaniem należy najpierw usunąć spacje, następnie sprawdzić czy szukany łańcuch jest pusty np:
var liczba = document.getElementById("pole").value;
var n = liczba.length;
for (i=0; i0) ....
zad.2 document.getElementById("").value; zawsze pobiera wartość typu string w JS. Powinno się dać znak "+" na początku tej linijki by wartość pobierana była typu int lub int lub float. JS jest na tyle mądry że domyśli się że te stringi są liczbami i zamieni je na inny typ, ale są też przypadki że się nie domyśli i mogą wyjść różne niechciane rzeczy.
Dziekuje, bardzo za tutorial :), stworzylem, zegar z animacja :D
W drugim zadaniu: Jeśli ktoś się zastanawia dlaczego program pokazuje, że np. 3 > 25:
Wyjęcie wartości właściwością -- .value -- sprawia, że program przy porównywaniu traktuje te liczby jak tekst (3 > 2), aby tego uniknąć można zastosować np. funkcję -- Number() -- tzn. Number(liczba1) oraz Number(liczba2) lub Number(document.getElementById("xxx").value)
Dziękuję za wskazówkę, właśnie miałem z tym problem ;) Pozdrawiam i miłego dnia !
Dopiero zaczynam przygodę z "programowaniem". Mam jedno pytanko. Gdy zapisujemy for (i=liczba1; i
Wiem, że po czasie, ale dobrze podbić ten komentarz- Miałem problem z wartościami przekraczającymi 10. w tym przypadku nagle cos przestawało działać i nic się nie wyświetlało. po dopisaniu Number wszystko działa tak jak trzeba
Bardzo podoba mi się to, że wszystko w Pana filmikach jest wytłumaczone w bardzo prosty sposób, jest czytelny i zrozumiały ( jak kod w HTML-u ;) ). Zarówno Pan, jak i Pan Damian Stelmach (który mnie uczy, bo chodzę do ZSTI) tworzycie kontent, który jest przydatny, co widać po ilości subskrypcji i wyświetleniach :) Pozdrawiam i dziękuję za pomoc :)
O jacie, ależ ten filmik jest świetny! Pozdrawiam 😊
HTML5 nie wymaga zamykania znaczników takich jak meta czy input. Zamknięcie w stylu /> występuje tylko w XHTML, więc zgodnie ze zdefiniowanym DOCTYPE'm nie widzę potrzeby stosowania takiego zamknięcia. Poza tym bardzo dobra robota :)
;) Uwielbiam ten kanał! Szkoda, że nie jest jeszcze bardziej rozwijany, chociaż domyślam się jak wiele czasu pochłania zmontowanie filmu na takim poziomie, mimo to dziękuję za bogatą treść!
Zrobiłem to w ten sposób. Patrząc po komentarzach, troszeczkę poszedłem na około :).
var liczba = document.getElementById("pole").value;
var lancuch = liczba + "0";
if (liczba > 0) document.getElementById("wynik").innerHTML = "dodatnia";
else if (liczba < 0) document.getElementById("wynik").innerHTML = "ujemna";
else if (lancuch == "0") document.getElementById("wynik").innerHTML = "nie wpisałeś żadnej wartości";
else if (liczba == 0) document.getElementById("wynik").innerHTML = "zero";
else document.getElementById("wynik").innerHTML = "wpsiana wartość nie jest liczbą";
Patryk Zieliński Aby ograniczyć liczbę instrukcji można też to tak zrobić:
function sprawdz(){
var liczba = document.getElementById("pole").value;
if(liczba > 0) document.getElementById("wynik").innerHTML = "dodatnia";
else if(liczba < 0) document.getElementById("wynik").innerHTML = "ujemna";
else if(liczba == '0') document.getElementById("wynik").innerHTML = "zero";
else document.getElementById("wynik").innerHTML = "to nie jest liczba";
}
ale wtedy jednak dla wartości 00 czy 00000 itp. otrzymujemy "to nie jest liczba" przy czym powinniśmy otrzymać raczej "zero".
+Dominik Magdaleński albo wstawić required do znacznika input
A nie prościej switchem? ;)
Obejrzałem dwa pierwsze już x razy. Teraz z niecierpliwością czekam na kolejny.
Jak zwykle świetna robota. Dodatkowo zadania domowe...świetny pomysł,
Zadanie #1
Wystarczy do warunku liczba==0 dopisać po "&&" (bez cudzysłowów, koniunkcja warunków znana np. z c++) liczba.length>0.
Funkcja length zwraca liczbę znaków zmiennej.
HTML i CSS to bułka z masłem. Przy JS już czacha dymi...
a wiesz, że też tak mam. Jednak to też się da zrozumieć. trzeba po prostu pisać, pisać, pisać. Ja się boję co będzie jak zacznę PHP. Jednak najpiej objektówka c++.
Heh siedzę już w tym z 1,5 roku i jak na to patrzę to mi się wydaje to takie proste ;)
i co? Dalej to robisz?
To PHP nie zaczynaj bo łeb rozwali ;)
@@bartekj1346 to w czym programujesz?
Świetnie wytłumaczone!
Ale to przyjemne uczyć się z tych tutoriali.
Co do zadania z tym pustym polem to rozwiązałem to tak :):
function sprawdz()
{
var liczba = document.getElementById("pole").value;
if (liczba>0) document.getElementById("wynik").innerHTML="dodatnia";
else if (liczba
bykufgf Zmienna liczba jest typu int, czyli jest liczbą całkowitą. Pisząc else if (liczba=="") występuje błąd, ponieważ cudzysłowy są charakterystyczne dla zmiennych typu string, czyli łańcuchów znaków. Przez twój zapis przeglądarka ma problem, czy zmienna liczba jest typu int, czy może typu string. Pozdrawiam.
+bykufgf Blok instrukcji warunkowych sprawdzających czy liczba jest większa, mniejsza lub równa 0 otaczamy kolejną instrukcją if z dwoma warunkami - jeśli długość większa od zera i jeśli wartość równa wartości integer (litery też mają wartość liczbową - tablica ASCII)
function check()
{
var number = document.getElementById("field").value;
if (number.length > 0 && number == parseInt(number))
{
if (number > 0) document.getElementById("result").innerHTML = "dodatnia";
else if (number < 0) document.getElementById("result").innerHTML = "ujemna";
else if (number == 0) document.getElementById("result").innerHTML = "zero";
}
else
document.getElementById("result").innerHTML = "Podaj liczbę!";
}
+Paweł Feliksik Dobre rozwiązanie z tym parseInt ale nie dawało mi spokoju że nie można wpisać liczby z przecinkiem albo kropką i wymyśliłem coś takiego (co o tym sądzisz?):
function sprawdz()
{
var liczba = document.getElementById("pole").value;
//funkcja zamianaNaKropki() zamienia pierwszy odnaleziony przecinek na kropkę.
//następnie sprawdza czy wartość wyszukania przecinka w liczbie
//jest prawdziwa (true) jeśli tak to funkcja kończy działanie
//w innym przypadku nastepuje ponowne wywołanie funkcji sprawdzającej
function zamianaNaKropki()
{
liczba = liczba.replace(",", ".");
if(!liczba.search(",")) zamianaNaKropki();
}
zamianaNaKropki();
var dlugosc = liczba.length;
if(dlugosc>0 && liczba == parseFloat(liczba))
{
if(liczba>0) document.getElementById("wynik").innerHTML="dodatnia";
else if(liczba
+NieznanyGościu w js nie ustala się z góry rodzaju zmiennej, jest ona określana przez przeglądarkę w momencie jej zadeklarowania (wpisania). Poza tym podany wyżej kod przez bykufgf nie zadziała poprawnie, gdyż warunki funkcji if są sprawdzane po kolei, więc dla pustego pola funkcja if nadal będzie zwracać wartość zero. Wystarczy zmienić kolejność - najpierw wstawić warunek, żeby funkcja sprawdzała czy zmienna liczba jest pustym ciągiem znaków, a następnie by sprawdzała czy jest równa 0.
I jajco :) dlaczego u nas nie było takich profesorów?
bo nie
Świetna robota, zabieram się za oglądanie :) Pozdrawiam.
Prawda jest taka że Cały kurs JavaScriptu na kanale Pasja Informatyki zajmuje mniej niż jesteśmy w szkole!
te slajdy genialne dziękuje !
nie ma za co :)
Skrypt zadania 2 po ustaleniu wytycznych przez pana Mirosława wygląda tak:
KOLEJNOŚĆ WARUNKÓW POZA PĘTLAMI JEST ISTOTNA !
Na początku skrypt powinien sprawdzic od razu czy obie wartości to nie liczby bo wtedy eliminujemy ten wariant potem poszczególne wartości wykorzystując do tego funkcje isNaN
Wystarczy pamiętać że false określa liczbe a true określa wszystko inne dzięki czemu wyeliminowaliśmy błędne warianty tekstu.
A potem już tylko pętle inkrementująca dla ciagu rosnacego i deinkrementująca dla ciągu malejącego
Oczywiście jestem skory do dyskusji więc jak zauważysz błąd możesz mi w odpowiedzi powiedzieć co jest nie tak lub jak inaczej mógłbym wyszczuplić kod
Z góry dziękuje !
function wypisz()
{
var liczba1 = document.getElementById("pole1").value;
var liczba2 = document.getElementById("pole2").value;
var napis = "";
if(isNaN(liczba1)==true && isNaN(liczba2)==true)
{
napis = "Wartosc z obu stron są bledne";
}
else if(isNaN(liczba1)==true && isNaN(liczba2)==false)
{
napis = "Wartosc z lewej strony jest bledna";
}
else if(isNaN(liczba1)==false && isNaN(liczba2)==true)
{
napis = "Wartosc z prawej strony jest bledna";
}
else if(liczba2 > liczba1)
{
for (i=liczba1; i liczba2)
{
for (i=liczba1; i>=liczba2; i--)
{
napis = napis + i + " ";
}
}
document.getElementById("wynik").innerHTML = napis;
}
Super. Myślałem nad tym i nie mogłem dojść do działającego kodu. Faktycznie wymagane jest koniecznie określenie czy isNaN ma być true czy false bo bez tego nie działa.
@@przemekkrawczynski8477 też się zastanawiałem nad tym kiedyś ale spokojnie to w koderce jest spoko że trzeba kombinować ;)
Super materiał dydaktyczny.
Spodobało mi się zadanie 2 i zrobiłem je (bez patrzenia na rozwiązanie w filmie).
Jakby ktoś chciał zerknąć to jest tutaj:
codepen.io/ArturKy/pen/RMLwgp
Witam, świetny kurs, aczkolwiek wdarł się malutki błąd. W drugim zadaniu powinno byc var liczba1 = parseFloat(document.... albo parseInt inaczej po wpisaniu wartosci np 2 i 11 wynik bedzie niepoprawny. Pozdrawiam,
Pozdrawiam,
rzeczywiście teraz działa za każdym razem, a dlaczego tak się dzieje?
Kolego dziękuje za pomoc. Pozdrawiam
Dziękuje panu bardzo ponieważ dzieki panu wszystko zrozumiałem
Dziękuje za kurs ;)
11:29 - "Wpiszmy może.. 21 .. i kliknę sprawdź. I co, i jajco, nie działa" :D
*xDDDDDD*
Dzięki Panu wracam do programowania :) dziękuję!
a ja mam do zadania 2 rozwiazanie takie:
function wypisz()
{
var liczba1 = document.getElementById("pole1").value;
var liczba2 = document.getElementById("pole2").value;
var napis = "";
if((isNaN(liczba1)) && (isNaN(liczba2)))
{
document.getElementById("wynik").innerHTML = "wartości w obu polach nie są liczbami.";
}
else if(isNaN(liczba1))
{
document.getElementById("wynik").innerHTML = "Wartość w polu pierwszym nie jest liczbą";
}
else if(isNaN(liczba2))
{
document.getElementById("wynik").innerHTML = "Wartość w polu drugim nie jest liczbą";
}
else if(liczba1=liczba2;i--)
{
napis = napis + i + " ";
}
document.getElementById("wynik").innerHTML = napis;
}
else if(liczba1==liczba2)
{
document.getElementById("wynik").innerHTML = "Obie liczby są takie same";
}
}
może ciut długie ale u mnie działa, i dodałem tylko funkcje, ponieważ reszta jest bez zmian.
Można by to nieco skrócić. Wystarczy, że if zmieni wartość x i później wystarczy ją wypisać, więc nie musisz wypisywać tekstu w każdym if'ie.
No i nawiasy lepiej jest robić w ten sposób:
if(liczba1
Aby rozwiązać ten problem z zerem można do if dołożyć takie coś:
if (liczba == 0 && liczba! = "")
Sprawdza on nie tylko czy liczba wynosi 0, ale też czy pole nie jest puste.
Użyłeś innerHTML. Jak wpiszesz do pola tekstowego skrypt JS to się wykona i użytkownik może mieć dostęp do plików cookie (ID, e-mail, hasło itp.).
Świetny odcinek! Biorę się za następny :D
Świetny odcinek!!!
Kurczę twoje kursy są najlepsze!!! Nie spotkałem lepszych nawet po angielsku :D Mam prośbę o zrobienie kursu na temat chociaż podstaw JQUERY myślę że to ułatwi jeszcze bardziej ludziom pisanie stron :D
Świetny lektor! :)
Witam, chciałbym zapytać dlaczego w pańskim programie nie wszystkie przedziały liczbowe (oczywiście mówie o przedziałach, gdzie 1 liczba jest mniejsza od 2) są wyświetlane prawidłowo a np w przedziale (5;10) nie wyświetla się nic, podobnie w wielu innych kombinacjach tak jak (5;20) bądź (4;30). Byłbym wdzięczny za udzielenie odpowiedzi, pozdrawiam
Stary temat, ale na pewno wiele nowych osób tu wciąż zagląda.
Powodem jest tu typ danych użytych w warunku dla pętli for. Przesyłane value z inputa jest odczytywane przez js jako string i takiego typu używa do warunku. Cyfry w stringu porównywane są znak po znaku, dlatego '5'2). Warunek z fora jest więc niespełniony i pętla się nie wykonuje.
Rozwiązaniem tego problemu jest użyć funkcji parseInt("liczba1") i liczba 2. Na logikę można by było również po prostu zmienić input type z text na number, jednak to nie zadziała. W HTML nie ma pojęcia typu zmiennych i przesyłana wartość jest stringiem niezależnie od wartości type. Jest ona tylko informacją dla urządzenia klienta co ma wpisać i np. jaka klawiaturę wyświetlić na telefonie.
Mam nadzieję, że komuś pomogłem :)
Tak jak przedmówca zauważył wystarczy dokonać zamiany na typ 'int'.
np. tak:
var number1 = parseInt(document.getElementById("box_1").value, 10);
szczegóły funkcji można znaleźć tutaj: developer.mozilla.org/pl/docs/Web/JavaScript/Reference/Global_Objects/parseInt
Nie rozwiązuje to problemu wpisania większej liczby jako pierwszej, wtedy trzeba zrobić główną pętlę i porównać liczby i zrobić dwa fory dla różnych sortowań
moje rozwiązanie:
// main loop
if(number1 < number2) {
// listing numbers in ascending order
for(i = number1; i = number2; i--)
{
result = result + i + " ";
}
document.getElementById("show_result").innerHTML = result;
}
I wtedy można wykorzystać w body input type number by pozbyć się reszty znaków (oprócz E) ;)
WOW najlepszy poradnik do javascript jaki widziałem! Kiedy kolejne odcinki?
Nie wiem czy tu bylo, i wiem ze troche po czasie, ale lepiej zaczac Js pozno niz wcale :D ja zrobilem zmienna var blankSpace=""; i w instrukcji warunkowej dalem else if(number==blankSpace)...
Ile ludzi, tyle pomyslow :D pozdrawiam i dziekuje za wspaniala serie filmikow. Dzieki Panu pokochalem informatyke i programowanie :)
Panie Mirosławie, jest Pan świetny. Zna się Pan najlepiej na 2 rzeczach:
1. Jak w ciekawy, zrozumiały sposób wytłumaczyć trudne zagadnienia informatyczne pokazane odpowiednio i profesjonalnie na adekwatnych i praktycznych przykładach.
2. Jak dbać o oczy internautów😄
Mistrzowskie kursy i za darmoszkę. Trochę rozwodzi się pan jak Kardaś w swoich kursach, ale jest w tym metoda.
Szkoda, że odcinek nie wyszedł trochę wcześniej, bo 18 stycznia miałem egzamin z kwalifikacji E14, ale jakoś dałem radę :) BTW bardzo dobrze wytłumaczone, i ciekawie przedstawione. Daję kciuka w górę :)
Idealnie, jak zawsze! :-)
Dzięki za ten kurs :D
nie ma za co
w zadaniu 3, celem uniknięcia problemów z timerem, polecenie setTimeout("zmienslajd()", "500") należy przypisać do timer1, aby po wykonaniu zmienslajd() zmienna przybierała nową, poprawną wartość, a więc powinno to wyglądać tak:
timer1 = setTimeout("zmienslajd()", "500")
Dziękuję za te rewelacyjne kursy.
Natomiast dla zadania z 17 minuty widzę potrzebę sprawdzania warunków w określonej kolejności:
var liczba=document.getElementById("pole").value;
if (liczba=="") document.getElementById("wynik").innerHTML="Pole nie może być puste. Wpisz coś!";
else if (liczba==0) document.getElementById("wynik").innerHTML="zero";
else if (liczba0) document.getElementById("wynik").innerHTML="dodatnia";
else document.getElementById("wynik").innerHTML="To nie jest liczba!";
Samo sprawdzenie warunku liczba=="0" spowoduje, że np. liczba 0000 będzie odczytana jako NaN.
W pierwszym zadaniu wystarczy zmienić input type na "number" zamiast "text" pola do którego wpisujemy wartość, wtedy nie będzie można wprowadzić innej wartości niż liczby.
Po sprawdzeniu warunku czy liczba jest dodatnia/ujemna, ale przed czy jest zerem dodajemy linijkę
else if (liczba == "") document.getElementById("wynik").innerHTML = "wprowadź liczbę"; .
W pole można wpisać literkę e - nie jest to błąd, służy do zapisu liczby w notacji naukowej.
Drugie zadanie jest na razie zbyt skomplikowane :D Przy porównaniu liczba1 = 23 i liczba2 = 123 widzi, że liczba 2 jest mniejsza. Chyba porównuje tylko pierwszą cyfrę? Trzeba by zrobić dopełnienie pierwszej liczby (jeśli ma mniej znaków od drugiej) zerami z lewej strony i potem przy wypisaniu wyniku te zera usunąć.
Po "zabezpieczeniu" programu żeby wypisał liczby w drugą stronę jest to samo:
Gdy liczba1 = 66 a liczba2 = 8 to skrypt wypisuje tylko 66(a powinien wypisać wszystkie liczby od 66 do 8). Gdy porównam liczba1=66 i liczba2=08 skrypt wypisuje poprawnie wszystkie liczby.
dzięki temu filmikowi zrobiłem konwenter liter z naszego alfabetu, na alfabet grecki :D
Mam pomysł ustaw Mirosław Zelent zbiórkę na popularnym portalu zbiórka,pomagam( tak aby było bez prowizji dla firmy dużej) np kwotę 200 000 zł na na rozwój lub taką jak uważasz realną.Sam wpłacę więcej niż 100 zł i udostępnie na fb,twiterzę gdzie się da.Dzięki Twojej wiedzy wróciłem ,po nie udanej nauce na forum.Reklama na youtube do zbiórki i zobaczysz ,że pieniądze wpadną a należą się jak psu buda! Bo widzę ,że z reklam może być ciężko a motywacja będzie dobra.
( Mile widziane jqerry,BOOTSTRAP,javastript dalej :)
Powiadam Wam , ktokolwiek dał łapkę w dół przy filmach pana Mirosława będzie smażył się w piekle illuminati_confirmed();
MEGA
illuminatiConfirmed();
Function illuminati_confirmed()
{
GetElementById("użytkownikKtoryDalŁapkeWDol").innerHimToHell="burn"
}
Jestem pod wielki wrażeniem jaki kawał dobrej roboty Pan robi!
Ci co dali łapkę w dół niech sczezną w ogniu piekielnym ;]
Moje rozwiązanie zadania domowego, może komuś się przyda.
pastebin.com/ta2xUJD2
Mam problem. Fading Out i In raz działa tak jak powinno, a za chwile tylko pokazuje i ukrywa obraz bez płynnego efektu.
#2 Jeśli chodzi o to jak sprawdzić, która wartość jest większa można to zrobić tak
var mniejsza = Math.min(val1,val2);
var wieksza = Math.max(val1,val2);
Co do sprawdzenia czy wpisana wartość to liczba:
var val = document.getElementById('pole1').value;
var w = document.getElementById('wynik');
if(val!=parseInt(val)) w.innerHTML="To nie liczba";
else w.innerHTML="Prawidłowo";
Dzięki
dla mnie początkującej super ! dziękuję !
pół godziny nie wiedzialem dlaczego nie dzialają te obrazki na mojej stronie a to była wina adblocka XD - wyłączyłem go i wszystko śmiga jak powinno.
mialem to samo w odcinku html2 albo css2 gdzie uzywalem reklamy Pana Miroslawa xD wylaczylem adblocka i dzialalo, ale smialem sie potem sam z siebie :D
mi dalej nie działa.. nie mam pojęcia dlaczego :/
przepisałem wszystko dokładnie, adblocka wyłączyłem i nic:/
@@filmowyamator7475 może zdjęcia są w .jpg :D Pozdrawiam
@@LisuByku Jest to bez roznicy jedynie zmieniasz na .jpg i smiga
A jak zmienić wysokość i szerokość zdjęć w tym sliderze? Bo jak chciałem przypisac klase w w tym skrypcie, by pozmieniać wszystko w css to nie działa
Pierwsze zadanie zrobiłem tak (uwaga spoiler):
else if (liczba == "")
document.getElementById("wynik").innerHTML = "pusto";
else if (liczba == (/\xa0/>=1))
document.getElementById("wynik").innerHTML = "to jest spacja";
Wyszukałem sobie jak zapisuje się spację (\xa0) w JS, kod sprawdza jaka jest ilość spacji i jeżeli jest równa lub większa od 1 to wypisuje "to jest spacja". Działa : )
woo stary idealny nauczyciel👌
W drugim programie wpisałem u siebie, żeby mi wypisał liczby aż do kilku bilionów. Zawiesiłem tym na amen firefoxa i ubuntu. Kiepsko to świadczy o przeglądarce i systemie.
Strategiusz Nie świadczy to źle ani o przeglądarce ani o systemie. Każesz zrobić przeglądarce coś strasznie wymagającego, nie ma takiej mocy, szczególnie, że już przy milionie liczb suwak przewijania strony jest maluśki, na moim monitorze full hd zajęło to kilkanaście, jak nie kilkadziesiąt razy więcej miejsca niż monitor potrafi pokazać. Ty próbujesz wykonać to samo dla liczby kilka milionów razy większej, zwykła przeglądarka internetowa na zwykłym komputerze nigdy Ci tego nie wykona.
super!!!
Co do zadania #1 to wystarczy zamienić else if (liczba == 0) na else if (liczba == "0") i już :)
Zadanie nr 1
Kod wydaje się oporny na spacje we wszelkich konfiguracjach i wszelkie inne znaki wpisywane w pole input
function sprawdz() {
var liczba = document.getElementById("pole").value;
if (liczba > 0) {
document.getElementById("wynik").innerHTML = "dodatnia";
}
else if (liczba < 0) {
document.getElementById("wynik").innerHTML = "ujemna";
}
else if (liczba == "") {
document.getElementById("wynik").innerHTML = "nic nie wpisałeś";
}
else if (liczba == "0" ) {
document.getElementById("wynik").innerHTML = "zero";
}
else {
document.getElementById("wynik").innerHTML = "to nie jest liczba";
}
}
Proszę o testy :)
Żeby slider nie wariował przy natarczywym klikaniu, wystarczy przykryć stronę warstwą przezroczystego diva, na czas wykonywania funkcji fadeIn oraz fadeOut.
document.getElementById('overlay').innerHTML = "";
a po zakończeniu przejścia między slajdami wykonać funkcję nadpisującą zawartość diva overlay pustym cudzysłowiem
function erase() {
document.getElementById('overlay').innerHTML = "";
}
Ja dołożyłem trzecią zmienną dla timera wewnątrz funkcji ustawslajd() oraz resetowanie tego timera. Wtedy funkcja zmienslide() nie wywoła się jeśli klikniemy ustawslajd() w mniej niż 0,5 sekundy, bo będzie miała zresetowany timer i odpali się dopiero po 0,5 sekundy.
var timer3 =0;
function ustawslajd(numerslajdu)
{
clearTimeout(timer1);
clearTimeout(timer2);
clearTimeout(timer3);
numer = numerslajdu-1;
schowaj();
timer3=setTimeout("zmienslajd()", 500)
}
Sry, że odświeżam, ale może komuś się przyda :)
Slajder też naprawiłem. W funkcji ustawslajd() przypisywano argumentowi funkcji numer aktualnego slajdu, co powoduje to, że który numer nie klikniemy pokaże nam się slajd kolejny. Naprawiłem to w ten sposób, że do rzeczonej funkcji dodałem switcha, który zmienia nam numer slajdu do wyświetlenia w zależności od tego co prześlemy funkcji (zmienna nrslajdu), funkcja wygląda tak: wklej.org/id/1750845/
Dziękuję :)
ladnie tlumaczysz ale uzywasz starych standardòw js'a. Nie stosuje sie aktualnie atrybutow typu on*="" np onclick, to sa stare mechanizmy, aktualnie uzywa sie nowego modelu rejestracji zdarzen - addEventListener.
+Mateusz Woźniak ta metoda jest czescia dom level 2, addEventListener byl juz wspierany przez ie9 wydane w 2010r, takze ten model rejestracji zdarzen to nie nowosc a obecny standard
Ten moment kiedy piszesz linia w linię to co na filmie a nie działa :)))))
No, to dziwne bo jak pobierzesz plik z odcinka i nawet to przekopiujesz i wkleisz to działa, a jak przepiszesz linijka w linijkę to nie działa CO JEST!?
@@igorekd8672 Też 2020 :)
nie działa mi ani tak ani tak ;-;
@@chinskibaj1783 a działa Ci pobrany plik? Jeśli tak to znaczy że źle kodujesz lub coś w tym stylu bo mi działa
@@igorekd8672 MI zadziałało po tym jak zmieniłem cudzysłów na pojedynczy w sekcji :documen.getElementById('wynik').innerHTML
Zadanie domowe numer 2
function wypisz()
{
var liczba1=document.getElementById("pole1").value;
var liczba2=document.getElementById("pole2").value;
var napis=" ";
if (liczba1
super!
Do zadania z 18:37 należało by dopisać jeszcze jeden warunek, jak by jakiś żartowniś chciał wpisać "-0":)
else if(liczba==-0) wynik.innerHTML="Nie ma takiej liczby";
dziękuję :)
4 rok technikum logistycznego here, zobaczymy czy da się przebranżować w rok i napisać maturkę z javy albo c++ :)
thx
Co do slidera to trzeba dodać kolejną zmienną globalną timer3, i funkcji ustawSlide() dodać linijkę clearTimeout(timer3); gdzie timer3 = setTimeout("zmienSlajd()",500);
Dlaczego jak wprowadzam w pierwszym polu liczbę 9 a w drugim np. liczbę 12 to jako wynik wypisuje mi tylko liczbę 9 ? (a nie 9 10 11 12)?
Nareszcie :D
We! Nowy odcinek.