41 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: події та обробники

koala написав:

Значення поля можна отримати так: 

document.getElementById("data").value

для сучасних браузерів ще можна написати

data.value
Подякували: koala1

221VOLT вебсайт

42 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: події та обробники

ExPy написав:

harentius, на це є багато причин.

▼Прихований текст

Деколи iнфи банально нема на рос./укр. мовi. Я знаю аксiому, що "справжнiй погроммiст мусить знати iнглiш!!!!", але реальнiсть трохи iнакша. Ну i в вiдеокурсi часто все розжовано i структуризовано.
Тай не вебом єдиним..по реверсу/системному програмуваннi курси багато кому допомогли, там все складнiше чим console.log..

▼Прихований текст

можна було і не купувати :)

▼Прихований текст

221VOLT вебсайт

43 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: події та обробники

elektryk написав:

Придбав відеоуроки по JavaScript Михайла Русакова, а вони виявились наскрізь москальські. Таке враження, що він тупо читає довідник, а не підручник!!
Тож я не можу зробити єлементарну вправу:
1 При наведенні курсора на зображення розмір width має стати 500 (а був 100);
2 при сході курсора з зображення, воно повинне повернутись до початкового розміру.
З першою частиною я впорався без проблем:

function halterMouseOver(img){
    img.width = '500';
}
<img src='01.jpg' width='100' onmouseover="halterMouseOver(this)"/>

Аналогічно зробив і другу частину.

function halterMouseOut(img){
    img.width = '100';
}
<img src='01.jpg' width='100' onmouseout="halterMouseOut(this)"/>

Але з'ясувалося, що виникло два зображення. Одна функція працює з одним, а друга з іншим.
То як зарадити моєму горю??

справді, несподіванка -- купувати курс у хлопця з Росії,
та дивуватись на російське  :) ото ви любите пожартувати

а по темі, буквально по назві теми --
imho вам варто ознайомитись з

▼Прихований текст

https://learn.javascript.ru/introduction-browser-events
і зверніть увагу на addEventListener

221VOLT вебсайт

44 Відповідь від ExPy Востаннє редагувалося ExPy (03.04.2020 19:09:21)

  • ExPy
  • ExPy
  • Новий користувач
  • Поза форумом
  • Дата реєстрації: 15.08.2018
  • Повідомлень: 323
    • Репутація: 159

Re: події та обробники

Можна написати щось 

<input type="date" id="d">
...
let d = document.getElementById("d");
d.valueAsDate.getTime();

буде час в секундах..

Подякували: harentius, 221VOLT2

45 Відповідь від elektryk Востаннє редагувалося elektryk (03.04.2020 19:40:36)

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

harentius написав:

Мені здається, що це трохи безсмисленно. Якщо автор з цим не може впоратися, то йому не потрібно зараз це завдання робити. Це не його.
Тут з двох одне: або учить основи, поки не зрозуміє, або просто чимось іншим займатися. Все. (Ну не повинно таке завдання займати кілька місяців на вирішення. Тут не тільки знання людини, а ще й підходи. Не знайшов рішення в одному місці, значить повинен на стіну лізти шукати в іншому. І знайти.) Не знаю, можна попробувати https://www.w3schools.com/js/. Там є приклади, які можна попробувати, і там найперший приклад якраз схожий (але не на 100%) на те, що автор намагається зробити. Може основи програмування повчити. Може основи html. Але десь є серйозний пробіл. Його потрібно виявити і закрити.

▼Прихований текст

Мене взагалі завжди дивувало, як (і навіщо!) люди купляють якісь сумнівні курси, з якими потім довго і безсмисленно мучаться, якщо все необхідне є у відкритому доступі, і ще й, як правило, краще (w3schools точно краще, ніж "відеоуроки по JavaScript Михайла Русакова"). Звісно, бувають корисні і рідкісні речі, які варто купити на тому ж юдемі чи курсері, але то вже зовсім інше питання, і зовсім інший рівень.

З усіма зауваженнями згоден.
Ну, не продвинутий я. Не знаю я всіх джелел інфармації.

Що ж до того, навіщо мені на старість цим займатися??
Навіть не знаю, що сказати... Немає в мене пом'якшуючих обставин.

46 Відповідь від harentius

  • harentius
  • Користувач
  • Поза форумом
  • Дата реєстрації: 23.01.2020
  • Повідомлень: 54
    • Репутація: 80

Re: події та обробники

▼Прихований текст

можна було і не купувати

В мене на такі ресурси алергія, тому і не рекомендую ;) Але думаю ви самі знаєте як воно) Ну не пам'ятаю я, як я це все вивчив) Тому рекомендую людям те, що мені здається адекватним) Щодо самої англійської, як мені слушно хтось казав...

Я знаю аксiому, що "справжнiй погроммiст мусить знати iнглiш!!!!"

Ну знаєте, там на сайті перекладач є (справа вгорі)... Та й у Хромі самому можна клацнути правою кнопкою і там є "Translate" .... і перекладайте на свій язьік скільки влізе. Я пішов по класичних джерелах, і моя суб'єктивна думка, що починати завжди треба з них.

З усіма зауваженнями згоден.
Ну, не продвинутий я. Не знаю я всіх джелел інфармації.

В чому тоді проблема? На виправдовуйтеся, виконуйте... Від виправдань ні мені, ні вам користі не буде.

Що ж до того, навіщо мені на старість цим займатися??

Ну у вас повинна бути причина і мотивація, інакше ви б не починали... Розумієте, ваші запитання такі, що я (може тому що ще мало з вами спілкувався) не можу оцінити ваш рівень, і для чого ви цим пробуєте займатися. А ви якось не пробуєте допомогти в цьому розібратися.
Щоб мій меседж хоч якийсь мав смисл, я просто приведу вам приклад коду, що вам треба було зробити

  const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 60000;
  console.log(diffInSeconds);

Попробувать тут: https://jsfiddle.net/bytmh7c4/1/
Запитання:
1) Що вам було незрозуміло?
2) Що кожен із 4 рядків робить?
3) Як можна було б по іншому записати

document.getElementById("date")

?

Подякували: ExPy1

47 Відповідь від harentius

  • harentius
  • Користувач
  • Поза форумом
  • Дата реєстрації: 23.01.2020
  • Повідомлень: 54
    • Репутація: 80

Re: події та обробники

Перепрошую, я помилився трохи, різниця ж в мілісекундах, я сперся на своє старе повідомлення)) Нема мені прощення ))
Тож: 

  const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 1000;
  console.log(diffInSeconds);

https://jsfiddle.net/bytmh7c4/2/

Старі запитання в силі)

Подякували: 221VOLT1

48 Відповідь від elektryk Востаннє редагувалося elektryk (03.04.2020 23:07:43)

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

harentius написав:

Перепрошую, я помилився трохи, різниця ж в мілісекундах, я сперся на своє старе повідомлення)) Нема мені прощення ))
Тож: 

  const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 1000;
  console.log(diffInSeconds);

https://jsfiddle.net/bytmh7c4/2/

Старі запитання в силі)

А перший рядок можна розбити на декілька??
наприклад:
1.1 створення об'єкту;
1.2 зчитування значення;
1.3 присвоювання значення об'єкту.

Зрозуміло начеб-то все. Але сам би ніколи в житті не догадався.

І ще я не люблю const. Чому не var??

49 Відповідь від elektryk

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

ExPy написав:

Можна написати щось 

<input type="date" id="d">
...
let d = document.getElementById("d");
d.valueAsDate.getTime();

буде час в секундах..

В рядку 

let d = document.getElementById("d");

хіба не треба добавляти .value??
Щоб отримати 

let d = document.getElementById("d").value;

50 Відповідь від elektryk

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

harentius написав:

Старі запитання в силі)

Achtung!! Код не працює

<input type="date" id="date"><br>
<script type="text/javascript">
const userInputDate = new Date(document.getElementById("date").value);
  const nowDate = Date.now();  
  const diffInSeconds = (nowDate - userInputDate) / 1000;
console.log(diffInSeconds);
  alert(diffInSeconds);
</script>

Видає NaN
[Violation] Forced reflow while executing JavaScript took 163ms

51 Відповідь від koala

  • koala
  • koala
  • Лінива тваринка
  • Поза форумом
  • Дата реєстрації: 01.05.2013
  • Повідомлень: 15 617
    • Репутація: 13330

Re: події та обробники

elektryk написав:

І ще я не люблю const. Чому не var??

Поки код маленький і ви можете його повністю тримати в голові, var виглядає зручнішим: хочу - зміню, не хочу - не зміню.
Коли код займає кілька файлів і ви над ним працюєте більше ніж тиждень, var може перетворити ваше життя на пекло: код щойно працював - а тепер усе шкереберть, бо десь в іншому місці щось змінюється, а ви цього не пам'ятаєте. const гарантує, що значення буде постійним.

elektryk написав:

А перший рядок можна розбити на декілька??

elektryk написав:

Видає NaN

https://codepen.io/fkoala/pen/yLNWZjN

Подякували: 221VOLT, leofun012

koala вебсайт

52 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: події та обробники

elektryk написав:

А перший рядок можна розбити на декілька??
...
І ще я не люблю const. Чому не var??

а навіщо розбивати?

var -- то давніший стандарт, означає просто "змінна"
const та let -- то новіший стандарт, означає "константа" та "змінна" відповідно

Подякували: leofun011

221VOLT вебсайт

53 Відповідь від elektryk

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

221VOLT написав:
elektryk написав:

А перший рядок можна розбити на декілька??
...
І ще я не люблю const. Чому не var??

а навіщо розбивати?

var -- то давніший стандарт, означає просто "змінна"
const та let -- то новіший стандарт, означає "константа" та "змінна" відповідно

Я це знаю.
А розбивати на элементарні цеглини для новачків тобто для чайників потрібно, щоб вони знали ті цеглини.
Бо так і будуть програмувати блоками. А якщо потрібно трішки змінити блок, вони не зможуть, бо сприймають блок як елементарну цеглину.

54 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: події та обробники

elektryk написав:
ExPy написав:

Можна написати щось 

<input type="date" id="d">
...
let d = document.getElementById("d");
d.valueAsDate.getTime();

буде час в секундах..

В рядку 

let d = document.getElementById("d");

хіба не треба добавляти .value??
Щоб отримати 

let d = document.getElementById("d").value;

там вже є valueAsDate , навіщо value ?

Подякували: koala, leofun012

221VOLT вебсайт

55 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: події та обробники

elektryk написав:
221VOLT написав:
elektryk написав:

А перший рядок можна розбити на декілька??
...
І ще я не люблю const. Чому не var??

а навіщо розбивати?

var -- то давніший стандарт, означає просто "змінна"
const та let -- то новіший стандарт, означає "константа" та "змінна" відповідно

Я це знаю.
А розбивати на элементарні цеглини для новачків тобто для чайників потрібно, щоб вони знали ті цеглини.
Бо так і будуть програмувати блоками. А якщо потрібно трішки змінити блок, вони не зможуть, бо сприймають блок як елементарну цеглину.

const userInputDate = new Date(document.getElementById("date").value);

===

const v1 = document.getElementById("date").value;
const userInputDate = new Date(v1);

можна і більше розписати

const v0 = document.getElementById("date");
const v1 = v0.value;
const userInputDate = new Date(v1);

221VOLT вебсайт

56 Відповідь від elektryk

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

Ой спасибі!!

А ще я з'ясував, що ввід числа в поле є пріорітетним.
До цього я думав, що навпаки...

57 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: події та обробники

elektryk написав:

А ще я з'ясував, що ввід числа в поле є пріорітетним.

*DONT_KNOW* тепер я загубився...
що означає "ввід числа в поле є пріоритетним" ?

Подякували: leofun011

221VOLT вебсайт

58 Відповідь від elektryk

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

221VOLT написав:
elektryk написав:

А ще я з'ясував, що ввід числа в поле є пріорітетним.

*DONT_KNOW* тепер я загубився...
що означає "ввід числа в поле є пріоритетним" ?

Ну, це просто. Ось код. 

<input type="date" id="date" value ="2020-04-04">

В ньому вже задана одна дата "2020-04-04".
Але коли ми вводимо в поле іншу дату, то інша має приоритет.

59 Відповідь від koala

  • koala
  • koala
  • Лінива тваринка
  • Поза форумом
  • Дата реєстрації: 01.05.2013
  • Повідомлень: 15 617
    • Репутація: 13330

Re: події та обробники

Ви щось неправильно зрозуміли. Код

<input type="date" id="date" value ="2020-04-04">

Означає, що на момент завантаження сторінки в цьому полі буде значення 2020-04-04. Але, очевидно, ми можемо це значення змінити, і тоді там буде інше значення. Ви ж не вважаєте, що при зміні значення змінної нове значення є "пріоритетним"?

Подякували: leofun01, 221VOLT2

koala вебсайт

60 Відповідь від elektryk

  • elektryk
  • elektryk
  • Користувач
  • Поза форумом
  • Звідки: Харків
  • Дата реєстрації: 25.07.2013
  • Повідомлень: 666
    • Репутація: 150

Re: події та обробники

koala написав:

Ви щось неправильно зрозуміли. Код

<input type="date" id="date" value ="2020-04-04">

Означає, що на момент завантаження сторінки в цьому полі буде значення 2020-04-04. Але, очевидно, ми можемо це значення змінити, і тоді там буде інше значення. Ви ж не вважаєте, що при зміні значення змінної нове значення є "пріоритетним"?

Саме так вважаю.