Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   простой калькулятор с помощью checkbox (https://javascript.ru/forum/misc/69663-prostojj-kalkulyator-s-pomoshhyu-checkbox.html)

Foknik 10.07.2017 18:44

простой калькулятор с помощью checkbox
 
Добрый день, уважаемые форумчане гуру javascript & jquery!
У меня просьба направить на правильный путь новичка!
Я верстальщик и недавно начал учить javascript & jquery!
Сверстал калькулятор где имеются чекбоксы и поля select.

Нужно сделать так что при клике по checkbox и выбора определенного поля select автоматически менялась цена без клика по кнопке.
с селектами я разобрался а вот с checkbox немогу!
Нужно добиться чтобы слаживались несколько переменных которые меняются в зависимости от состояния checked самого чекбокса!
Выложу кусочек кода помогите пожалуйста!!!

Код:

$('.for-services').change(function(){
  $select = $('select#select option:selected').attr('data-service');
  // тут я выбираю данные option поля select;
});

$('#check_1').click(function() {
  var $result
  if ( this.checked ) {
        // если checked ...
  $result = 6;
    console.log($result);
        } else {
          $result = 0;
          console.log($result);
      };
});

$('#check_2').click(function() {
    var $result_2
    if ( this.checked ) {
        // если checked ...
        $result_2 = 8;
        console.log($result_2);
        } else {
            $result_2 = 0;
            console.log($result_2);
        };
});
       
$final_prise = parseInt($select) + parseInt($total) + parseInt($total_2);
        console.log($final_prise);
        $('span#total').text($final_prise);
});

Не складываются переменные в одну общую ( $final_prise = parseInt($select) + parseInt($total) + parseInt($total_2); ) ни в консоли не складываются не выводятся в елемент span
console.log($final_prise); $('span#total').text($final_prise);

Что не так просвятите подскажите пожалуйста очень буду благодарен!!!

рони 10.07.2017 18:51

Foknik,
напишите отдельную одну функцию для установки и сложения всех переменных.
и замените все click и change на неё.

Foknik 10.07.2017 19:05

То-есть функции click и change прийдется убрать вообще?
Можете написать пример ? Пожалуйста!!!??

рони 10.07.2017 19:09

Foknik,
рисуйте ваши 4 элемента, на всякий случай кнопка

Foknik 10.07.2017 19:24

Вот ссылка на визульный вид калькулятора
http://cimbalyuk.esy.es/
Работает только выбор Доп. услуги и 2 первые чекбокса До 5 и До 10 остальные неподключал еще так как небыло смысла

рони 10.07.2017 19:41

Foknik,
... :-?

рони 10.07.2017 20:09

Foknik,
<script>
    $(function() {
    function calc() {
        var $select = +$("select#select option:selected").data("service");
        var $price_2 = $("input#check_2:checked").length ? +$("input#check_2:checked").data("price") : 0;
        var $price_3 = $("input#check_3:checked").length ? +$("input#check_3:checked").data("price") : 0;
        var $final_prise = $select + $price_2 + $price_3;
        $("span#total").text($final_prise)
    }
    $("select#select, input#check_2, input#check_3").change(calc)
});
  </script>

Foknik 11.07.2017 02:55

:dance: :dance: :dance:
Спасибооо!!!!!!
Выручили!!!


Часовой пояс GMT +3, время: 08:33.