onchange, onkeypress...
Здраствуйте. Пишу простенький калькулятор, и столкнулся с проблемой: хочу, чтобы калькулятор работал в реальном времени, без всяких там кнопок посчитать и т.д. Для этого, как я понял, нужно использовать для инпутов onkeypress, onfocus, onchange и т.д.
Проблема состоит в том, что никакой реакции эти операторы не дают (делал по этому примеру: http://learn.javascript.ru/play/tuto...m/percent.html ). :help: Подскажите, может ли это быть конфликтом скрипта с onkeyup и onmousedown, прописанных непосредственно в инпутах? И как мне быть вообще? Стоит ли дальше жить в этом жестоком мире?)) |
<ul> <li><a onclick="apple.a()">10 Яблочек</a></li> <li><a onclick="cherry.a()">50 Вишенек</a></li> </ul> Вкусняшка <div id="fruitname"></div><br> Сколько <input id="fruithowmany" type="text" onmousedown="this.value=this.value.replace(/([^0-9])/g,'');" onkeyup="var n=this.value.replace(/([^0-9])/g,''); if(n!=this.value) this.value=n;" onchange="changed(this);" maxlength="3" size="1" ><br> Цена <input type="text" id="price"><br> <div id="fruitsum"></div> var apple = {fruitName: 'Яблочки', howMany:10, price:4.21}; var cherry = {fruitName:'Вишенки', howMany:50, price:4.32}; function addel() { document.getElementById('fruitname').innerHTML = this.fruitName; document.getElementById('fruithowmany').value = this.howMany; document.getElementById('fruitprice').value = this.price; document.getElementById('fruitsum').innerHTML = Math.round(this.price*this.howMany*70)/100; //Замена toFixed(2) alert('Остальных 30% ворует правительство!'); } apple.a = addel; cherry.a = addel; var fruithowmanyElem = document.getElementById('fruithowmany'); fruithowmanyElem.onkeypress = calc; fruithowmanyElem.onkeyup = calc; fruithowmanyElem.oninput = calc; fruithowmanyElem.onpropertychange = function(){ event.propertyName == "value" && calc(); }; var fruitpriceElem = document.getElementById('fruitprice'); fruitpriceElem.onkeypress = calc; fruitpriceElem.onkeyup = calc; fruitpriceElem.oninput = calc; fruitpriceElem.onpropertychange = function(){ event.propertyName == "value" && calc(); }; function calc(){ var skolko = +fruithowmanyElem.value; var cena = +fruitpriceElem.value; var sum; sum = Math.round(cena*skolko*70)/100; var otkat = sum*0.3/cena; alert('Откат правительству составил '+otkat+this.fruitname); } |
nasqad,
Других способов создания динамического калькулятора я не знаю... |
у nasqad вроде рабочий вариант...
опишите логику, что там должно прибавляться/отниматься и т.д., а то я нифига не понял ) |
Цитата:
|
Цитата:
поэтому и попросил автора логику описать, чтоб было понятно, как это должно работать |
Вот в песочнице собственно сам код. В песочнице все работает так, как надо, но когда сохраняю в отдельный файл - on... не работает =(
Может это из-за того, что не прописал <!DOCTYPE HTML> ? http://learn.javascript.ru/play/J8B3wb Код должен делать следуюшее: 1) Кликаем на элемент в списке (Яблочки, Вишенки). 2) Функция addel добавляет в инпуты значения обьекта (apple или cherry соответственно). 3) При редактировании инпута срабатывают операторы onkeypress, onkeyup, oninput, onpropertychange и "на лету" обчисляют функицей calc значения и вставляют их в <div id="fruitsum"></div> и текстовые инпуты. ------------- Как видите, начальные значения в инпутах обчисляет функция addel, а изменения -функция calc. По возможности подскажите пожалуйста, как сделать, чтобы это все делала только функция calc, буду очень благодарен)) |
Цитата:
|
Этот JavaScript сведет нас в могилу.:(
|
Цитата:
|
Часовой пояс GMT +3, время: 09:51. |