Просмотр полной версии : Калькулятор цен на js
:cray: Помогите пожалуйста!
есть скрипт калькулятора, цен на услуги
калькулятор считает цену взависимости от выбранной валюты. мне нужно добавить функцию которая будет перечитывать цены услуг с дополнительным значением.
вот то что у меня есть https://codepen.io/alexej-kachan/pen/oNxXgLx
c4udok,
проблема то в чём?
проблема не могу связать две функции
одна считает цену по курсу(например 1 урок стоит 50$ или 1350 рубл. 8 уроков 80$ и так далее), а вторая функция делает тоже самое но при выборе элемента input и берет значение из его data(тоесть формула такая цена*курс*data из импут )
c4udok,
не осилил ваше описание, но может чем поможет такой вариант ...
заменить полностью на
document.addEventListener("DOMContentLoaded", function() {
let db = [{
ISO4217: '$',
multiply: 1
},
{
ISO4217: 'RUB',
multiply: 70.5
},
{
ISO4217: 'UAH',
multiply: 27
}
];
document.getElementById("valuta").addEventListener('change', function(e) {
let option = db[this.selectedIndex];
rebuildPrices(option);
});
function rebuildPrices({ISO4217, multiply}) {
[...document.querySelectorAll('[data-cost]')].forEach(el => {
const num = el.dataset.cost,
span = el.querySelector('span');
span.innerHTML = `${(num * multiply).toFixed(2)} ${ISO4217}`
})
}
rebuildPrices(db[0])
});
<b>Выберите язык преподавания:</b><br>
<input type="radio" name="nameRadio" value="1" checked="checked"/>
<input type="radio" name="nameRadio" value="20"/>
<input type="radio" name="nameRadio" value="300"/>
<input type="radio" name="nameRadio" value="400"/>
вот тут. нужно что бы он также работал как и select, только добавлял в формулу значение value
не могу разобраться уже 4 день, помогите пожалуйста
при выборе элемента input
прогресс -- неизвестный инпут обрёл имя name="nameRadio"
только добавлял в формулу значение value
формулу напишите.
при выборе
select валюты ('цена за один урок' * 'курс валюты' + 'добавить знак валюты')
input язык преподавателя(доп цена)- ('цена за один урок'* 'курс валюты(из select валюты)' * 'input.value(nameRadio)' + 'добавить знак валюты' )
c4udok,
document.addEventListener("DOMContentLoaded", function() {
let db = [{
ISO4217: '$',
multiply: 1
},
{
ISO4217: 'RUB',
multiply: 70.5
},
{
ISO4217: 'UAH',
multiply: 27
}
];
document.addEventListener('change', function({target}) {
if(target.closest('#valuta, [name="nameRadio"]')) {
let option = db[document.querySelector('#valuta').selectedIndex];
rebuildPrices(option);
}
});
function rebuildPrices({ISO4217, multiply}) {
const val = document.querySelector('[name="nameRadio"]:checked').value || 1;
document.querySelector('#rezultatRadio').innerHTML = val;
[...document.querySelectorAll('[data-cost]')].forEach(el => {
const num = el.dataset.cost,
span = el.querySelector('span');
span.innerHTML = `${(num * multiply * val).toFixed(2)} ${ISO4217}`;
})
}
rebuildPrices(db[0])
});
Блиииин СПАСИБО! СПАСИБО!!:dance: :dance: :dance:
Все работает!
Капец столько возился!
скажи а есть возможнотсь сделать округление до 0 для <h5 class="text-center pricepacketprice" data-cost='105.5'><span id="indificator">$105.5</span></h5>
я не хочу наглеть конечно
сделать округление до 0
toFixed(2)
:-?
точнее для class="pricepacketprice"
c4udok,
сложно понять что именно вам нужно.
имею ввиду кратно 10. если 1495 то 1500. если 36 то 40 . если 22 то 20
есть возможнотсь сделать округление до 0
function rebuildPrices({ISO4217, multiply}) {
const val = document.querySelector('[name="nameRadio"]:checked').value || 1;
document.querySelector('#rezultatRadio').innerHTML = val;
[...document.querySelectorAll('[data-cost]')].forEach(el => {
const num = el.dataset.cost,
span = el.querySelector('span'),
limit = el.classList.contains('pricepacketprice') ? 0 : 2;
span.innerHTML = `${(num * multiply * val).toFixed(limit)} ${ISO4217}`;
})
}
имею ввиду кратно 10.
function rebuildPrices({ISO4217, multiply}) {
const val = document.querySelector('[name="nameRadio"]:checked').value || 1;
document.querySelector('#rezultatRadio').innerHTML = val;
[...document.querySelectorAll('[data-cost]')].forEach(el => {
const num = el.dataset.cost,
span = el.querySelector('span'),
limit = el.classList.contains('pricepacketprice') ? Math.floor(num * multiply * val / 10 ) * 10 : (num * multiply * val).toFixed(2);
span.innerHTML = `${limit} ${ISO4217}`;
})
}
Блин где ты учился? спасибо большое!
а для class="indificator" аналогичный код?
нужно оставить один знак после запитой?
сейчас сижу разбираю код по частям) хоть в рамку ставь!
нужно оставить один знак после запитой?
1 вариант пост 16
limit = el.classList.contains('pricepacketprice') ? 0 : 1;
2 вариант пост 16
toFixed(1)
1 вариант пост 16
limit = el.classList.contains('pricepacketprice') ? 0 : 1;
2 вариант пост 16
toFixed(1)
тоесть код будет:
limit = el.classList.contains('pricepacketprice') ? Math.floor(num * multiply * val / 10 ) * 10 : (num * multiply * val).toFixed(2);
limitе = el.classList.contains('indificator') ? Math.floor(num * multiply * val / 10 ) * 10 : (num * multiply * val).toFixed(2);
?
тоесть код будет:
код будет прежним, ничего кроме одной цифры менять или добавлять не надо.
в строке 7 двойку поменять на единицу(для обоих вариантов).
Как сделать так?
let url = ("#order:" + "<p class="uroktext text-center"> текст</p> (например 5 или 10 уроков)" + "активный таб <a class="nav-link active" data-toggle="tab" href="#vi" id="vii">Взрослый индивидуально</a>(например взрослый индивидуально или Ребенок индивидуально)" + "Язык преподователя текст активного радио(например Near Netive)" + "=" + "limit')
должно получить такая враза
<a class="prca" href="#order: 5 Уроков Взрослый индивидуально, язык преподователя Near Netive =1000"> <button class="pricepacket pricepacketbutton text-center pricepac">
Оставить заявку
</button> </a>
Очень странное сочетание
<a ...>
<button>
</button>
</a>
Кто при клике должен реагировать?
Или оба? Сначала действие по кнопке, потом переход?
Что из чего получиться должно, все равно непонятно.
я просто кнопку обернул в ссылку. должная ссылка страбатывать
voraa,
для эффекта кнопки, но это не важно для скрипта
для эффекта кнопки
Не занимайтесь глупостями, да и href="#order: 5 Уроков... тоже кошмар какой-то. Можно и ссылку оформить под кнопку, но если задача запустить сценарий на клиенте, то зачем тут ссылка?
c4udok,
мне сложно вам помочь, может сначала вам немного повысить уровень подготовки, здесь есть учебник (https://learn.javascript.ru/).
vBulletin® v3.6.7, Copyright ©2000-2025, Jelsoft Enterprises Ltd. Перевод: zCarot