Перейти к содержимому


Фотография

[JS] Подсчет суммы для оплаты

js

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 8

#1 sergey21645

sergey21645

    Новичок

  • Пользователь
  • Pip
  • 34 сообщений

Отправлено 20 Октябрь 2017 - 17:22

Здравствуйте!
 

Нужен case-скрипт для подсчета суммы оплаты товара.

 

Например:

 

 

1. Выбираем товар из списка select

2. Вводим количество в input  (1)

3. Далее нужно перемножить количество на сумму товара и внести значение в соответсвующий input value (2)

 

Картинки :

http://yapx.ru/u/YQG6


Сообщение отредактировал sergey21645: 20 Октябрь 2017 - 17:23


#2 ronswonson

ronswonson

    Участник

  • Пользователь
  • PipPip
  • 71 сообщений

Отправлено 20 Октябрь 2017 - 21:28

Все очень просто. 

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!-- Select товара, Value это его цена-->
<select id="prod" onchange="f()">
    <option value="30">1й уровень (цена 30 рублей)</option>
    <option value="40">2й уровень (цена 40 рублей)</option>
    <option value="50">3й уровень (цена 50 рублей)</option>
    <option value="60">4й уровень (цена 60 рублей)</option>
</select>

<!-- Input с количеством -->
Количество: <input id="num" type="text" value="1" onchange="f()">

<!-- К оплате-->
К оплате: <input type="text" id="sum">
</body>
<script src="script.js"></script>
</html>

JS: 

function f(){
    var p = document.getElementById('prod').value,
        n = document.getElementById('num').value,
        s = document.getElementById('sum').value = Number(p) * Number(n);
}

f();

  • sergey21645 это нравится

#3 sergey21645

sergey21645

    Новичок

  • Пользователь
  • Pip
  • 34 сообщений

Отправлено 21 Октябрь 2017 - 4:56

 

Все очень просто. 

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!-- Select товара, Value это его цена-->
<select id="prod" onchange="f()">
    <option value="30">1й уровень (цена 30 рублей)</option>
    <option value="40">2й уровень (цена 40 рублей)</option>
    <option value="50">3й уровень (цена 50 рублей)</option>
    <option value="60">4й уровень (цена 60 рублей)</option>
</select>

<!-- Input с количеством -->
Количество: <input id="num" type="text" value="1" onchange="f()">

<!-- К оплате-->
К оплате: <input type="text" id="sum">
</body>
<script src="script.js"></script>
</html>

JS: 

function f(){
    var p = document.getElementById('prod').value,
        n = document.getElementById('num').value,
        s = document.getElementById('sum').value = Number(p) * Number(n);
}

f();

Спасибо большое!



#4 Santiago

Santiago

    Постоянный пользователь

  • Пользователь
  • PipPipPipPipPip
  • 5 053 сообщений

Отправлено 21 Октябрь 2017 - 13:27

Я, пока читал первый пост, в голове уже ангуляр подключил и начал писать директиву))



#5 sergey21645

sergey21645

    Новичок

  • Пользователь
  • Pip
  • 34 сообщений

Отправлено 23 Октябрь 2017 - 6:12

Cнова здравствуйте.

 

А можно сделать, чтобы оно сразу считало и вносило значения? Т.е. в режиме реального времени, а не когда переключаешь select. :rolleyes:



#6 ronswonson

ronswonson

    Участник

  • Пользователь
  • PipPip
  • 71 сообщений

Отправлено 23 Октябрь 2017 - 13:46

Cнова здравствуйте.

 

А можно сделать, чтобы оно сразу считало и вносило значения? Т.е. в режиме реального времени, а не когда переключаешь select.  :rolleyes:

Он считает как только ты меняешь select и кол-во. 



#7 sergey21645

sergey21645

    Новичок

  • Пользователь
  • Pip
  • 34 сообщений

Отправлено 23 Октябрь 2017 - 17:02

Он считает как только ты меняешь select и кол-во. 

Ну да, а нужно чтобы сразу менял значение. Проще говоря, нужно на onkeyup повесить



#8 ronswonson

ronswonson

    Участник

  • Пользователь
  • PipPip
  • 71 сообщений

Отправлено 23 Октябрь 2017 - 18:15

Ну да, а нужно чтобы сразу менял значение. Проще говоря, нужно на onkeyup повесить

Но я ведь и говорю, что значение уже сразу меняется. Что мешает поменять onchange на onkeyup?  :D


Сообщение отредактировал ronswonson: 23 Октябрь 2017 - 18:16


#9 sergey21645

sergey21645

    Новичок

  • Пользователь
  • Pip
  • 34 сообщений

Отправлено 24 Октябрь 2017 - 16:40

Но я ведь и говорю, что значение уже сразу меняется. Что мешает поменять onchange на onkeyup?  :D

В поле "количество" не поставил событие  :unsure: Извиняюсь, за свою невнимательность :)


Сообщение отредактировал sergey21645: 24 Октябрь 2017 - 16:40




Темы с аналогичным тегами js

Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных