1 Тема від elektryk Востаннє редагувалося elektryk (03.03.2020 23:34:04)

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

Тема: події та обробники

Придбав відеоуроки по 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)"/>

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

2 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

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

elektryk написав:

Придбав відеоуроки по JavaScript Михайла Русакова, а вони виявились наскрізь москальські.

Ви хіба не бачили, якою вони мовою?  :D

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

bebyk вебсайт

3 Відповідь від bebyk Востаннє редагувалося bebyk (04.03.2020 00:23:20)

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

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

elektryk написав:

Тож я не можу зробити єлементарну вправу:
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)"/>

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

Треба ж обидві функції в одне зображення додати:

function halterMouseOver(img){
    img.width = '500';
}

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

Працюючий приклад на CodePen

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

bebyk вебсайт

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

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

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

Звісно я так і робив. Але в мене чомусь не виходило. Друга функція не працювала і в нотепаді відображалась іншим кольором.

А за відповідь дякую. Спробую ще раз.

5 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

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

elektryk написав:

Звісно я так і робив. Але в мене чомусь не виходило. Друга функція не працювала і в нотепаді відображалась іншим кольором.

А за відповідь дякую. Спробую ще раз.

Можу оцінити лише той шмат коду, що ви його надали.  *PARDON*

Кидайте інший, подивлюся і його.

bebyk вебсайт

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

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

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

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

Звісно я так і робив. Але в мене чомусь не виходило. Друга функція не працювала і в нотепаді відображалась іншим кольором.

А за відповідь дякую. Спробую ще раз.

Можу оцінити лише той шмат коду, що ви його надали.  *PARDON*

Кидайте інший, подивлюся і його.

Щиро дякую. Все чудово працює.
Помилка була в кавичках.

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

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

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

Створити функцію, котра викликаеться при натисканні кнопки "рахувати" і рахує синус чи косинус в залежності від вибраного елементу випадаючого списку.

З чого починати??

8 Відповідь від ostap34PHP

  • Дата реєстрації: 27.01.2016
  • Повідомлень: 770
    • Репутація: 452

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

@elektryk,

1. Натискання кнопки:

https://css.in.ua/html/event/onclick
https://translate.google.com/translate? … rev=search

2. Отримання вибраного елементу з списку:

https://translate.google.com/translate? … rev=search

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

ostap34PHP вебсайт

9 Відповідь від elektryk Востаннє редагувалося elektryk (10.03.2020 21:36:02)

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

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

ostap34PHP написав:

@elektryk,

1. Натискання кнопки:

https://css.in.ua/html/event/onclick
https://translate.google.com/translate? … rev=search

2. Отримання вибраного елементу з списку:

https://translate.google.com/translate? … rev=search

Я все забув... Навіть як в консоль заходити.

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

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

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

цей код недороблений, бо я не знаю, як правильно доробити.
Жаль, що рядки не нумеруються як в бейсику.
Потрібно якось вибрати одну функцію: синус чи косинус.
Код з цим справляється.

А як цю функцію передати далі??
Тобто як в рядку var sin = Math.sin(arg); замінити sin на result і щоб обчислення продовжились??
чисто механічна заміна на працює.

<body>
    <script type="text/javascript">
        function tri() {
            var arg = Number(document.getElementById("4islo").value);
            arg = arg * Math.PI / 180;
             var e = document.getElementById("funk"); 
             var result = e.options[e.selectedIndex].value;
             alert(result);
            
            var sin = Math.sin(arg);
            alert(sin);
            var cos = Math.cos(arg);
            alert(cos);
        }
    </script>
    <form method="GET" name="form" >
        <input type="text" id="4islo" ><br>
        <select id = "funk">
            <option>sin</option> 
            <option>cos</option> 
        </select><br>
        <input type="button" value="рахувати" id="rax"><br>
    </form>
    <script type="text/javascript">
    rax.addEventListener("click", tri);    
    </script>
</body>

11 Відповідь від WD Востаннє редагувалося WD (10.03.2020 23:56:21)

  • WD
  • Користувач
  • Поза форумом
  • Дата реєстрації: 14.12.2018
  • Повідомлень: 28
    • Репутація: 12

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

можна зробити через if

/* приклад */

if(result == 'sin'){
// код для синуса
}else if(result == 'cos'){
// код для косинуса
}else {
alert ('error');
}
▼Прихований текст
Подякували: 221VOLT1

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

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

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

WD написав:

можна зробити через if

/* приклад */

if(result == 'sin'){
// код для синуса
}else if(result == 'cos'){
// код для косинуса
}else {
alert ('error');
}
▼Прихований текст

Спасибі.
Я думав, що є спосіб безпосередньо вставляти в вираз Math.sin(arg); синус чи косинус.

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

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

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

Ідемо далі:
"Створіть форму з текстовим полем, куди користувач повинен буде ввести дату свого народження в форматі ДД.ММ.РРРР (наприклад, 25.05.1960)".

Якби одне число, то я б справився...

14 Відповідь від bebyk

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

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

elektryk написав:

Ідемо далі:
"Створіть форму з текстовим полем, куди користувач повинен буде ввести дату свого народження в форматі ДД.ММ.РРРР (наприклад, 25.05.1960)".

Якби одне число, то я б справився...

А в чому проблема? Я розумію, що з дропдаунами і лупами треба покохатися.  :D

А тут напевне зарадить звичайний <input type="date">.

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

bebyk вебсайт

15 Відповідь від bebyk Востаннє редагувалося bebyk (11.03.2020 22:49:15)

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

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

elektryk написав:

Жаль, що рядки не нумеруються як в бейсику.

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

Приміром, з мого Саблайму:

https://i.imgur.com/s8vhXbJ.png

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

bebyk вебсайт

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

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

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

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

Ідемо далі:
"Створіть форму з текстовим полем, куди користувач повинен буде ввести дату свого народження в форматі ДД.ММ.РРРР (наприклад, 25.05.1960)".

Якби одне число, то я б справився...

А в чому проблема? Я розумію, що з дропдаунами і лупами треба покохатися.  :D

А тут напевне зарадить звичайний <input type="date">.

Проблема в тому, що потім цю дату треба обробити.
А для цього треба буде числа, місяці та роки відокремити і обробляти окремо.
В цьому відокремлюванні і є проблема.

17 Відповідь від bebyk Востаннє редагувалося bebyk (12.03.2020 00:00:32)

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

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

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

Ідемо далі:
"Створіть форму з текстовим полем, куди користувач повинен буде ввести дату свого народження в форматі ДД.ММ.РРРР (наприклад, 25.05.1960)".

Якби одне число, то я б справився...

А в чому проблема? Я розумію, що з дропдаунами і лупами треба покохатися.  :D

А тут напевне зарадить звичайний <input type="date">.

Проблема в тому, що потім цю дату треба обробити.
А для цього треба буде числа, місяці та роки відокремити і обробляти окремо.
В цьому відокремлюванні і є проблема.

Як саме обробити?

В чому проблема працювати з value?

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

bebyk вебсайт

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

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

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

Ну, потрібно вирахувати кількість хвилин, які  громодянин прожив до цього часу.
А ще кількість секунд.

19 Відповідь від bebyk Востаннє редагувалося bebyk (12.03.2020 23:44:34)

  • bebyk
  • bebyk
  • Replace Group
  • Поза форумом
  • Дата реєстрації: 29.10.2018
  • Повідомлень: 1 655
    • Репутація: 1056

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

elektryk написав:

Ну, потрібно вирахувати кількість хвилин, які  громодянин прожив до цього часу.
А ще кількість секунд.

То в чім проблема? Відніміть від теперішніх секунд епохи секунди епохи в момент народження громадянина. Якщо громадянин народився до 1970, відповідно треба додати секунди до початку епохи до теперішніх.

valueAsNumber вам у поміч.

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

bebyk вебсайт

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

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

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

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

Ну, потрібно вирахувати кількість хвилин, які  громодянин прожив до цього часу.
А ще кількість секунд.

То в чім проблема? Відніміть від теперішніх секунд епохи секунди епохи в момент народження громадянина. Якщо громадянин народився до 1970, відповідно треба додати секунди до початку епохи до теперішніх.

valueAsNumber вам у поміч.

Але задача інша!!