Loading...
Samuil.Petrow avatar Samuil.Petrow 1550 Точки

[Homework] JavaScript Basics - DOM & Events

HTML JAVASCRIPT

Втора задача може би се нуждае от оптимизация за nest-натите div-ове.

На задача 4 доста размишление имаше в/у това какъв тип евент да се ползва и от "change", "keydown", "keyup" избрах последното, но може би второто да е по-удачно :?

Тагове:
7
JavaScript Fundamentals
aslv1 avatar aslv1 304 Точки

Здравей!

Мисля, че на 4та задача е най-подходящо да се използва oninput, най-малкото защото стойността на текстовото поле може да се променя не само от клавиатрурата smile

П. П. ЕТО ГО ! laughing

9
Samuil.Petrow avatar Samuil.Petrow 1550 Точки

Супер, точно такова поведение исках да постигна и първоначално мислех, че ще стане с onchange, но тогава се налага да бъде излезнато от контекста на инпута (клик или друго).

1
Tr00peR avatar Tr00peR 566 Точки

Браво колега!

Aз вчера се мъчих с разни onPaste и проверки на клипборда, ама така и не успях да го направя за пействане с десен бутон на мишката, а твоето си работи идеално.

3
GoShow avatar GoShow 595 Точки

Супер е решението, единствено бих препоръчал да извадиш oninput от HTML и да го вържеш като eventListener в скрипт файла. Иначе поздравления и от мен! И признавам взаимствах решението!

2
ZvetanIG avatar ZvetanIG 907 Точки

Здравейте колеги,

Ето моите решения от последното домашно. 

1. Like / Unlike Button  - HTML - JS
2. Display DIVs Content - HTML
3. Hide Odd Rows  - HTML - JS
4. Numbers Only Field  - HTML - JS
5. Print Mouse Coordinates - HTML - JS

Нещо което забелах в трета задача. В условието е записано  <script src="hideOddRows.js" />, а трябва да  е
<script src="hideOddRows.js" ></script>, иначе не работи скрипта.

 

 Моля някой модератор да изтрие темата, която дублирах  / бих го направил и сам, но някой е забранил достъпа/: https://softuni.bg/forum/questions/details/1674/0

 

Успех на предстоящия изпит!!!

 

 

14
VGeorgiev avatar VGeorgiev 1384 Точки

Относно първа задача няма нужда да селектираш отново елемента чрез document.getElementById във event handler-a. Ако приемаш аргумент ev, от него можеш да достъпиш кликнатия елемент: ev.target. addEventListener-a си подава като параметър на твоя event handler Event object-a, който съдържа и кликнатия елемент. Само трябва функцията ти да приема аргумент.

При втора задача използвай DocumentFragment, понеже ако са повече елементи ще е доста бавно.

3
petrovaliev95 avatar petrovaliev95 358 Точки

Здравейте колеги,

 

Ето и моето домашно. Приемам критики, ако има такива. :)

Доста нерви събрах с тази 3-та задача, докато не видях, че е объркано условието.

 

Поздрави, Даниел

8
Karlie avatar Karlie 438 Точки

Дани, цикълът ти на трета задача е излишно сложен. Ето моите решения (въпросният цикъл е на един ред и си работи):

1. Like / Unlike Button  - HTML - JS
2. Display DIVs Content - HTML
3. Hide Odd Rows  - HTML - JS
4. Numbers Only Field  - HTML - JS

2
petrovaliev95 avatar petrovaliev95 358 Точки

Здравей Ани,

Разгледах решението ти. Наистина е много кратко, но неможах да разбера как точно работи твоя алгоритъм.

Би ли ми разяснила?

 

Поздрави, Даниел

2
Karlie avatar Karlie 438 Точки

Влизаш в цикъла с нула (първият елемент - нечетен е). Маха се. Сега вече елементът, който е бил втори (четен), и е бил с индекс 1, става с индекс 0, а този който е бил трети (нечетен) става с индекс 1. Влизаме в i++ частта .Следващият индекс е 1, но едно вече е проверката за третия елемент (нечетен), а не за втория, както е било преди изтриването.

Е, при това решение изтриваме редовете, а не ги скриваме, но със скриване не мога да накарам бутонът да работи няколко пъти. Довечера ще го мисля пак.

 

 

 

1
zornitza_gencheva avatar zornitza_gencheva 28 Точки

Колеги имам нужда от съвет за 4-та задача. 

Направих бутона да се оцветява в червено когато се пише текст и фона да е бял когато се въвеждат цифти, но нещо не успявам да заредя червеният фон за секунди, както е по условие: 

function numbersOnly() {
         var func = function(e) {
              if (e.charCode < 48 || e.charCode > 57) {
                   var colorBackground = 'red';
                   e.preventDefault();
                   setTimeout(change(colorBackground), 1000);
              }else {
                   colorBackground = 'white';
                   setTimeout(change(colorBackground), 1000);
              }  
         };
         var inputNumbers = document.getElementById('numbers');
         inputNumbers.addEventListener('keypress', func, false);

         function change(colorBackground) {
                    document.getElementById('numbers').style.backgroundColor=colorBackground;
        }
}

0
kasskata avatar kasskata 492 Точки

Мисля че проблема идва от тази функция в която имаш e за променлива, не виждам от къде идва това чудо.

1
zornitza_gencheva avatar zornitza_gencheva 28 Точки

Здрасти,

всъщност Е е събитие, което прихваща натиснатия клавиш и идва от тук: 

 inputNumbers.addEventListener('keypress', func, false); - подадено е като параметър във func, и то вижда, че следи за event от тип: keypress, тоест това Е е събитие от тип натиснат клавиш; 

И после му казвам, ако кода на това събитие излиза извън рамките на кодовете на цифрите то направи фона червен -  да ама не.

То го прави червен до настъпване на другото събитие, когато се въвежда валиден вход, тоест когато се въвеждат цифри...

 

 

 

0
kasskata avatar kasskata 492 Точки
да бе ама не трябва ли да му напишеш fun(e) или нещо близко за да го приеме Виж също на var inputNumbers = document.getElementById('numbers'); напиши и .value за да сме спокойни че приема това което трябва да приема. напиши в HTML към този .js да инпута който ти трябва да приема text . за да ти го обърне в цифра преди това Добре си се постарала за операцията обаче ти няма входа според мен иначе логиката е така(усложнена, но така) Още нещо: погледни на Дани решението той го е направил добре и доста хитро с това isNaN Ако не се справиш, днес сме на лекция за CV може да се видим там и да помагаме :)
0
Karlie avatar Karlie 438 Точки

Хайде и аз да помоля за помощ с пета задача: някой има ли идея как може да се отчитат координатите не само когато мишката напусне пределите на документа, а и когато се движи вътре в него? Edit: проблемът е решен - ползвам onmousemove, вместо onmouseover и става екстра :)

0
zornitza_gencheva avatar zornitza_gencheva 28 Точки

Реших 5-та задача, но пак има нещо, което не е напълно довършено:

html and js

Не ми се получава добавянето на новият ред, тоест програмата заменя старата инфомация с нова вместо да добавя нови редове, което принципно е по-готино, но не това е условието на задачата.

0
P.Kostadinov avatar P.Kostadinov 41 Точки

textArea.innerText = "" + currentCoordinates + " Time:" + currentDate;

добави един плюс -  textArea.innerText += "" + currentCoordinates + " Time:" + currentDate + '\n;

Нещо такова ;)

0
zornitza_gencheva avatar zornitza_gencheva 28 Точки

Пробвах, не стана, пак е същото като изход. :(

Но благодаря за отговора!

0
P.Kostadinov avatar P.Kostadinov 41 Точки

Защо не пробваш вместо с 'innerText' с 'value' или с 'textContent' мисля, че първото(innerText) не се поддържа от firefox.

0
shorti avatar shorti 47 Точки

Ето и моята домашна GitHub Link
Домашната беше доста приятна, пробвах тетриса, но нещо не се получи желаният резултат и не го качих, ще се радвам да видя ако някои от колегите го е направи.

1
Karlie avatar Karlie 438 Точки

Еййй, разчоплих я накрая тая трета задача, хем не изтрива колоните, а ги крие, хем бутонът може да се използва, докато не изчезнат всички клетки: Hide Odd Rows

 

1
Markova avatar Markova 13 Точки

Здравейте, колеги!
Ето линк и с моите решение на задачи от 1 до 5:
JavaScript DOM & Events

1
kotow avatar kotow 34 Точки

Здравейте колеги.

Имам едно питане относно 3-тата задача. Дали при повторно натискане на бутона трябва да се скриват нечетните от осттаналите редове докато не се скрие цялата таблица.

Питам защото проверих 4 домашни и нито едно не беше така и реших да не го отчитам кто грешка.

0
milen_vm avatar milen_vm 68 Точки

Според мен от условието на задачата не става достатъчно ясно как трябва да бъде. Затова Аз не го смятам за грешка, но има колеги които са направили цялата таблица да изчезва - кой както го е разбрал. cool

0
Можем ли да използваме бисквитки?
Ние използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Можете да се съгласите с всички или част от тях.
Назад
Функционални
Използваме бисквитки и подобни технологии, за да предоставим нашите услуги. Използваме „сесийни“ бисквитки, за да Ви идентифицираме временно. Те се пазят само по време на активната употреба на услугите ни. След излизане от приложението, затваряне на браузъра или мобилното устройство, данните се трият. Използваме бисквитки, за да предоставим опцията „Запомни Ме“, която Ви позволява да използвате нашите услуги без да предоставяте потребителско име и парола. Допълнително е възможно да използваме бисквитки за да съхраняваме различни малки настройки, като избор на езика, позиции на менюта и персонализирано съдържание. Използваме бисквитки и за измерване на маркетинговите ни усилия.
Рекламни
Използваме бисквитки, за да измерваме маркетинг ефективността ни, броене на посещения, както и за проследяването дали дадено електронно писмо е било отворено.