Событие на input

261
19 декабря 2017, 20:20

В общем задача необходимо создать форму состоящую из двух строк.

  • 1-я строка: пользователь сайта вводит сумму
  • 2-я строка: отображается это значение умноженое на определенное число.

Пробовал сделать так:

function countCharPass(val) { 
  var quantity = document.getElementById('quantity').value; 
  if (quantity == "") { 
    alert("Вы не указали суму"); 
  } else { 
    cena = 440; 
    stoimost = quantity * cena; 
    document.getElementById('vivod').value.innerHTML = "Стоимость равна: " + stoimost + " р."; 
  } 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
 
 
 
<h3>Расчет стоимости</h3> 
<input type="text" id="quantity" name="quantity" onkeyup="countCharPass(this)  value=" " placeholder="Введите суму для обмена "> 
    <input type="text " id="vivod " name="vivod "  value=" " placeholder=" ">

Answer 1

Как-то так:

function countCharPass(val) { 
  var quantity = document.getElementById('quantity').value; 
  if (quantity == "") { 
    alert("Вы не указали суму"); 
  } else { 
    cena = 440; 
    stoimost = quantity * cena; 
    document.getElementById('vivod').value = "Стоимость равна: " + stoimost + " р."; 
  } 
 
}
input { 
  width: 200px; /* Задал ширину input-ам для наглядности */ 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
 
<h3>Расчет стоимости</h3> 
<input type="text" id="quantity" name="quantity" onkeyup="countCharPass(this)" value="" placeholder="Введите суму для обмена "> 
<input type="text" id="vivod" name="vivod" value="" placeholder="">

Что поправил:

  • Убрал лишние пробелы из идентификатора (id), типа (type) и имени (name) в HTML разметке
  • Заменил document.getElementById('vivod').value.innerHTML на document.getElementById('vivod').value в JavaScript
  • Увеличил ширину input элементов в CSS (не обязательно)
READ ALSO
Где хранить параметры для Ajax запроса
javascript

Где хранить параметры для Ajax запроса

Мое приложение состоит из множества таблиц с даннымиКаждая таблица имеет сортировки и фильтры (везде разные)

 239
Как это работает
javascript

Как это работает

Кто-нибудь, объясните, пожалуйста, как работает эта библиотека:

 233
Backbone rerender bootstrap select
javascript

Backbone rerender bootstrap select

Есть вьюха, в scope элемента находится select, и таблица, select служит фильтром для таблицыПри выборе определенного option select'a, по событию делаю rerender...

 307
React.js - мультидоменность
javascript

React.js - мультидоменность

Возможно ли в Reactjs сделать роутинг с поддоменами? Например, пользователь заходит на auth

 268