Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.04.2018, 15:28
Аватар для Dark_Delphin
Кандидат Javascript-наук
Отправить личное сообщение для Dark_Delphin Посмотреть профиль Найти все сообщения от Dark_Delphin
 
Регистрация: 25.07.2013
Сообщений: 129

Калькулятор простой в таблице
Всем привет.

Вот написан калькулятор.

не могу понять, почему он не работает.
Кто подскажет, почему он не считает?

Заранее благодарен.
Вложения:
Тип файла: zip Калькулятор.zip (1.8 Кб, 0 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 03.04.2018, 15:34
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,795

Консоль смотрите или сделайте макет.
Очень не многие станут скачивать архив, чтобы понять в чем ошибка.
Ответить с цитированием
  #3 (permalink)  
Старый 03.04.2018, 16:09
Аватар для Dark_Delphin
Кандидат Javascript-наук
Отправить личное сообщение для Dark_Delphin Посмотреть профиль Найти все сообщения от Dark_Delphin
 
Регистрация: 25.07.2013
Сообщений: 129

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <table class="">
          <tr>
            <td rowspan="2">Длина порезки, м</td>
            <td colspan="11" class="center">Толщина листа, мм</td>
          </tr>
          <tr class="center">
            <td>0,5-2</td>
            <td>3-4</td>
            <td>5-6</td>
            <td>7-8</td>
            <td>9-12</td>
            <td>13-15</td>
            <td>16-18</td>
            <td>19-22</td>
            <td>23-25</td>
            <td>26-30</td>
            <td>31-40</td>
         </tr>
<tr>
            <td>1-50</td>
            <td class="center">10,26</td>
            <td class="center">12,06</td>
            <td class="center">15,12</td>
            <td class="center">16,74</td>
            <td class="center">21,72</td>
            <td class="center">32,88</td>
            <td class="center">35,40</td>
            <td class="center">46,62</td>
            <td class="center">51,06</td>
            <td class="center">71,16</td>
            <td class="center">124,80</td>
          </tr>
                    <tr>
            <td>50-100</td>
            <td class="center">9,75</td>
            <td class="center">11,46</td>
            <td class="center">14,36</td>
            <td class="center">15,90</td>
            <td class="center">20,63</td>
            <td class="center">31,24</td>
            <td class="center">33,63</td>
            <td class="center">44,29</td>
            <td class="center">48,51</td>
            <td class="center">67,60</td>
            <td class="center">118,56</td>
          </tr>
                    <tr>
            <td>100-300</td>
            <td class="center">9,23</td>
            <td class="center">10,85</td>
            <td class="center">13,61</td>
            <td class="center">15,07</td>
            <td class="center">19,55</td>
            <td class="center">29,59</td>
            <td class="center">31,86</td>
            <td class="center">41,96</td>
            <td class="center">45,95</td>
            <td class="center">64,04</td>
            <td class="center">112,32</td>
          </tr>
                    <tr>
            <td>300-1000</td>
            <td class="center">8,72</td>
            <td class="center">10,25</td>
            <td class="center">12,85</td>
            <td class="center">14,23</td>
            <td class="center">18,46</td>
            <td class="center">27,95</td>
            <td class="center">30,09</td>
            <td class="center">39,63</td>
            <td class="center">43,40</td>
            <td class="center">60,49</td>
            <td class="center">106,08</td>
          </tr>
                    <tr>
            <td>1000-2000</td>
            <td class="center">8,21</td>
            <td class="center">9,65</td>
            <td class="center">12,10</td>
            <td class="center">13,39</td>
            <td class="center">17,38</td>
            <td class="center">26,30</td>
            <td class="center">28,32</td>
            <td class="center">37,30</td>
            <td class="center">40,85</td>
            <td class="center">56,93</td>
            <td class="center">99,84</td>
          </tr>
                    <tr>
            <td>2000 и &gt;</td>
            <td class="center">7,70</td>
            <td class="center">9,05</td>
            <td class="center">11,34</td>
            <td class="center">12,56</td>
            <td class="center">16,29</td>
            <td class="center">24,66</td>
            <td class="center">26,55</td>
            <td class="center">34,97</td>
            <td class="center">38,30</td>
            <td class="center">53,37</td>
            <td class="center">93,60</td>
          </tr>
                    <tr>
            <td>Прожиг грн/шт</td>
            <td class="center">1,20</td>
            <td class="center">1,38</td>
            <td class="center">1,56</td>
            <td class="center">2,64</td>
            <td class="center">3,48</td>
            <td class="center">5,10</td>
            <td class="center">5,64</td>
            <td class="center">6,60</td>
            <td class="center">21,54</td>
            <td class="center">28,20</td>
            <td class="center">62,40</td>
          </tr>
          <tr>
            <td colspan="12" class="tip">* Введите данные для расчета стоимости</td>
          </tr>
          <tr class="inputs1">
            <td>Метры погонные</td>
            <td class="center"><input class="styled_inp" type="text" data-index="1" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="3" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="5" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="7" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="9" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="11" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="13" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="15" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="17" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="19" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="21" value="" placeholder="0" /></td>
          </tr>
          
          <tr class="inputs2">
            <td>Прожиги шт</td>
            <td class="center"><input class="styled_inp" type="text" data-index="2" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="4" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="6" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="8" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="10" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="12" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="14" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="16" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="18" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="20" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="22" value="" placeholder="0" /></td>
          </tr>          

          <tr>
            <td colspan="12"></td>
          </tr>
          <tr class="results">
            <td>Работа</td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
          </tr>
          <tr class="total">
            <td>Всего</td>
            <td class="center total_cost"></td>
            <td>грн</td>
            <td colspan="12"></td>
          </tr>          
        </table>

<script type="text/javascript">
  function bl(val) {
    return val.replace(',','.');
  }
  function blackmetal_plasma_calc_recalc() {
    var calc_elem = document.getElementById('blackmetal_plasma_calc');
    var elems1 = calc_elem.querySelectorAll('.inputs1 input');
    var elems2 = calc_elem.querySelectorAll('.inputs2 input');
    var elems3 = calc_elem.querySelectorAll('tr.results td');
    var totals=[];
    var total = 0;
    var tmp1,tmp2;
    var ii;
    var prices1 = [10.26,12.06,15.12,16.74,21.72,32.88,35.4,46.62,51.06,71.16,124.8];
    var prices2 = [1.2,1.38,1.56,2.64,3.48,5.1,5.64,6.6,21.54,28.2,62.4];
    for (ii=0;ii<elems1.length;ii++) {
      tmp1 = parseFloat(bl(elems1[ii].value));
      if (isNaN(tmp1)) {
        tmp1 = 0;
      }
      if (tmp1 > 1999) {
        totals[ii] = tmp1 * prices1[ii] * 0.75;
      } else if (tmp1 > 999) {
        totals[ii] = tmp1 * prices1[ii] * 0.8;
      } else if (tmp1 > 299) {
        totals[ii] = tmp1 * prices1[ii] * 0.85;
      } else if (tmp1 > 99) {
        totals[ii] = tmp1 * prices1[ii] * 0.9;
      } else if (tmp1 > 49) {
        totals[ii] = tmp1 * prices1[ii] * 0.95;
      } else {
        totals[ii] = tmp1 * prices1[ii] * 1;
      }
      
      tmp1 = parseInt(elems2[ii].value);
      
      if (isNaN(tmp1)) {
        tmp1 = 0;
      }
      
      totals[ii] = totals[ii] + tmp1 * prices2[ii];
      
      total = total + totals[ii];
      
      elems3[ii+1].innerHTML = totals[ii].toFixed(2);
      
    }
    
    var total_elem = calc_elem.querySelector('tr.total td.total_cost');
    total_elem.innerHTML = total.toFixed(2);
    
  }
  
  blackmetal_plasma_calc_recalc();
  
  

</script>
Ответить с цитированием
  #4 (permalink)  
Старый 03.04.2018, 16:18
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,989

data-index="1" - не очень и удобно это.
Ответить с цитированием
  #5 (permalink)  
Старый 03.04.2018, 16:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

Dark_Delphin,
строка 2
Сообщение от Dark_Delphin
<table class="????????">
Ответить с цитированием
  #6 (permalink)  
Старый 03.04.2018, 17:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

Dark_Delphin,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">

</head>

<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <table class="blackmetal_plasma_calc">
          <tr>
            <td rowspan="2">Длина порезки, м</td>
            <td colspan="11" class="center">Толщина листа, мм</td>
          </tr>
          <tr class="center">
            <td>0,5-2</td>
            <td>3-4</td>
            <td>5-6</td>
            <td>7-8</td>
            <td>9-12</td>
            <td>13-15</td>
            <td>16-18</td>
            <td>19-22</td>
            <td>23-25</td>
            <td>26-30</td>
            <td>31-40</td>
         </tr>
<tr>
            <td>1-50</td>
            <td class="center">10,26</td>
            <td class="center">12,06</td>
            <td class="center">15,12</td>
            <td class="center">16,74</td>
            <td class="center">21,72</td>
            <td class="center">32,88</td>
            <td class="center">35,40</td>
            <td class="center">46,62</td>
            <td class="center">51,06</td>
            <td class="center">71,16</td>
            <td class="center">124,80</td>
          </tr>
                    <tr>
            <td>50-100</td>
            <td class="center">9,75</td>
            <td class="center">11,46</td>
            <td class="center">14,36</td>
            <td class="center">15,90</td>
            <td class="center">20,63</td>
            <td class="center">31,24</td>
            <td class="center">33,63</td>
            <td class="center">44,29</td>
            <td class="center">48,51</td>
            <td class="center">67,60</td>
            <td class="center">118,56</td>
          </tr>
                    <tr>
            <td>100-300</td>
            <td class="center">9,23</td>
            <td class="center">10,85</td>
            <td class="center">13,61</td>
            <td class="center">15,07</td>
            <td class="center">19,55</td>
            <td class="center">29,59</td>
            <td class="center">31,86</td>
            <td class="center">41,96</td>
            <td class="center">45,95</td>
            <td class="center">64,04</td>
            <td class="center">112,32</td>
          </tr>
                    <tr>
            <td>300-1000</td>
            <td class="center">8,72</td>
            <td class="center">10,25</td>
            <td class="center">12,85</td>
            <td class="center">14,23</td>
            <td class="center">18,46</td>
            <td class="center">27,95</td>
            <td class="center">30,09</td>
            <td class="center">39,63</td>
            <td class="center">43,40</td>
            <td class="center">60,49</td>
            <td class="center">106,08</td>
          </tr>
                    <tr>
            <td>1000-2000</td>
            <td class="center">8,21</td>
            <td class="center">9,65</td>
            <td class="center">12,10</td>
            <td class="center">13,39</td>
            <td class="center">17,38</td>
            <td class="center">26,30</td>
            <td class="center">28,32</td>
            <td class="center">37,30</td>
            <td class="center">40,85</td>
            <td class="center">56,93</td>
            <td class="center">99,84</td>
          </tr>
                    <tr>
            <td>2000 и &gt;</td>
            <td class="center">7,70</td>
            <td class="center">9,05</td>
            <td class="center">11,34</td>
            <td class="center">12,56</td>
            <td class="center">16,29</td>
            <td class="center">24,66</td>
            <td class="center">26,55</td>
            <td class="center">34,97</td>
            <td class="center">38,30</td>
            <td class="center">53,37</td>
            <td class="center">93,60</td>
          </tr>
                    <tr>
            <td>Прожиг грн/шт</td>
            <td class="center">1,20</td>
            <td class="center">1,38</td>
            <td class="center">1,56</td>
            <td class="center">2,64</td>
            <td class="center">3,48</td>
            <td class="center">5,10</td>
            <td class="center">5,64</td>
            <td class="center">6,60</td>
            <td class="center">21,54</td>
            <td class="center">28,20</td>
            <td class="center">62,40</td>
          </tr>
          <tr>
            <td colspan="12" class="tip">* Введите данные для расчета стоимости</td>
          </tr>
          <tr class="inputs1">
            <td>Метры погонные</td>
            <td class="center"><input class="styled_inp" type="text" data-index="1" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="3" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="5" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="7" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="9" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="11" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="13" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="15" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="17" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="19" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="21" value="" placeholder="0" /></td>
          </tr>

          <tr class="inputs2">
            <td>Прожиги шт</td>
            <td class="center"><input class="styled_inp" type="text" data-index="2" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="4" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="6" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="8" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="10" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="12" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="14" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="16" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="18" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="20" value="" placeholder="0" /></td>
            <td class="center"><input class="styled_inp" type="text" data-index="22" value="" placeholder="0" /></td>
          </tr>

          <tr>
            <td colspan="12"></td>
          </tr>
          <tr class="results">
            <td>Работа</td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
            <td class="center"></td>
          </tr>
          <tr class="total">
            <td>Всего</td>
            <td class="center total_cost"></td>
            <td>грн</td>
            <td colspan="12"></td>
          </tr>
        </table>

<script type="text/javascript">
  function bl(val) {
    return val.replace(',','.');
  }
  var calc_elem = document.querySelector('.blackmetal_plasma_calc');
  function blackmetal_plasma_calc_recalc() {
    var elems1 = calc_elem.querySelectorAll('.inputs1 input');
    var elems2 = calc_elem.querySelectorAll('.inputs2 input');
    var elems3 = calc_elem.querySelectorAll('tr.results td');
    var totals=[];
    var total = 0;
    var tmp1,tmp2;
    var ii;
    var prices1 = [10.26,12.06,15.12,16.74,21.72,32.88,35.4,46.62,51.06,71.16,124.8];
    var prices2 = [1.2,1.38,1.56,2.64,3.48,5.1,5.64,6.6,21.54,28.2,62.4];
    for (ii=0;ii<elems1.length;ii++) {
      tmp1 = parseFloat(bl(elems1[ii].value));
      if (isNaN(tmp1)) {
        tmp1 = 0;
      }
      if (tmp1 > 1999) {
        totals[ii] = tmp1 * prices1[ii] * 0.75;
      } else if (tmp1 > 999) {
        totals[ii] = tmp1 * prices1[ii] * 0.8;
      } else if (tmp1 > 299) {
        totals[ii] = tmp1 * prices1[ii] * 0.85;
      } else if (tmp1 > 99) {
        totals[ii] = tmp1 * prices1[ii] * 0.9;
      } else if (tmp1 > 49) {
        totals[ii] = tmp1 * prices1[ii] * 0.95;
      } else {
        totals[ii] = tmp1 * prices1[ii] * 1;
      }

      tmp1 = parseInt(elems2[ii].value);

      if (isNaN(tmp1)) {
        tmp1 = 0;
      }

      totals[ii] = totals[ii] + tmp1 * prices2[ii];

      total = total + totals[ii];

      elems3[ii+1].innerHTML = totals[ii].toFixed(2);

    }

    var total_elem = calc_elem.querySelector('tr.total td.total_cost');
    total_elem.innerHTML = total.toFixed(2);

  }



calc_elem.addEventListener('input', blackmetal_plasma_calc_recalc);

</script>

</body>
</html>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
простой калькулятор с помощью checkbox Foknik Общие вопросы Javascript 7 11.07.2017 02:55
простой калькулятор kekc91 Общие вопросы Javascript 12 28.12.2016 01:45
Простой калькулятор Valentinushka Элементы интерфейса 3 10.01.2016 20:29
Простой калькулятор под Joomla 3.3 artvasya Общие вопросы Javascript 0 24.02.2015 20:04
Простой калькулятор AlexFoxx Events/DOM/Window 12 18.02.2014 15:41