Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #11 (permalink)  
Старый 04.06.2020, 21:47
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от richlime
чтобы кнопка "Вычислить" была неактивной
А чем же процесс запускать? Тогда нужно две кнопки, одна для проверки, вторая для вычисления, но к чему?
Ответить с цитированием
  #12 (permalink)  
Старый 04.06.2020, 21:53
Новичок на форуме
Отправить личное сообщение для richlime Посмотреть профиль Найти все сообщения от richlime
 
Регистрация: 04.06.2020
Сообщений: 7

Ну она должна быть не активной до того момента, пока не будут заполнены все поля
Ответить с цитированием
  #13 (permalink)  
Старый 04.06.2020, 21:57
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

Сообщение от richlime
Ну она должна быть не активной до того момента, пока не будут заполнены все поля
напишите функцию которая вернёт true когда все поля заполнены.
Ответить с цитированием
  #14 (permalink)  
Старый 04.06.2020, 22:00
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от richlime
Ну она должна быть не активной до того момента
Тогда нужно установить обработчики полям формы, следящие за вводом в них и производящих проверку (можно делегировать форме), вот они и будут управлять доступностью кнопки. А сейчас то у вас одна кнопка запускающая процесс, как же вы его запустите, если она будет недоступна?
Ответить с цитированием
  #15 (permalink)  
Старый 04.06.2020, 23:44
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

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

Нужно обратить внимание на обрабатываемое событие (оно делегируется форме) input. О поддержке его можно прочесть здесь, следовательно и принимать решение - все норма или ... При обработке такого события вывод ошибок посредством alert будет просто раздражительным, поэтому будем выводить их на странице. Также сделаем не вывод ошибок во всех полях, а только для первого, в котором найдена ошибка. Также разобьем причину ошибки на два раздельных сообщения.

<form id="bank">
    <label>Сумма(руб.): </label>
    <input type="text" name="summ" /><br /><br />
    <label>Срок(мес.): </label>
    <input type="text" name="srok" /><br /><br />
    <label>Ставка(%):</label>
    <input type="text" name="stavka" /><br /><br />	
    <label>Общая сумма: </label>
    <input type="text" name="result" readonly /><br /><br />
    <input type="button" id="run" value="Вычислить!" disabled />
</form>

<p id="error"></p>

<script>

document.getElementById('bank').addEventListener('input', function() {
    let fld = this.elements, error = '';
        
    [...fld].slice(0, 3).some((e) => {
        if(!e.value || /\D/.test(e.value)) {
            let f = e.previousElementSibling.textContent.match(/.+(?=\()/);
            error = !e.value && `Заполните поле ${f}!` || `В поле ${f} разрешен ввод только цифр!`; 
            return true;
        }
    });
    
    document.getElementById('error').textContent = error; 
    fld.run.disabled = error;
});

document.getElementById('run').addEventListener('click', calculate);

function calculate() {
    this.form.result.value = (this.form.summ.value * (this.form.stavka.value/100/12) * this.form.srok.value).toFixed(2)
}
</script>

Последний раз редактировалось laimas, 05.06.2020 в 00:29.
Ответить с цитированием
  #16 (permalink)  
Старый 05.06.2020, 00:00
Новичок на форуме
Отправить личное сообщение для richlime Посмотреть профиль Найти все сообщения от richlime
 
Регистрация: 04.06.2020
Сообщений: 7

спасибо)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Бесплатный курс JavaScript (18 уроков)  Bokal Учебные материалы 2 16.11.2014 20:20
Динамическая подгрузка Javascript функции Jnas Общие вопросы Javascript 6 04.02.2014 14:58
функции в javascript zub_samata Общие вопросы Javascript 28 27.01.2014 20:53
javascript запуск функции alexandr2006 Общие вопросы Javascript 4 15.07.2013 19:16
Интерпретатор Java на JS kobezzza Оффтопик 24 11.10.2012 18:32