Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.05.2015, 18:18
Интересующийся
Отправить личное сообщение для dark_mc Посмотреть профиль Найти все сообщения от dark_mc
 
Регистрация: 10.05.2015
Сообщений: 13

Скрипт подсчета коммунальных услуг
Доброго времени суток! Пишу диплом и столкнулся с задачей которую не могу решить, точнее не знаю каким методом решить ее, сам изучаю javascript не очень то давно, надеюсь вы подскажете что и как!

И так, задача состоит в том, что бы изменять значения скрипта на странице в отдельном окне, что бы не трогать сам код! Но при этом он должен запоминать введенные значения при обновлении страницы.

Например в коде изменить цифры на свои, и скрипт должен их запомнить/заменить.
var svet= "0.32300"; 
var svetno= "63";
var gazyes = "1.7880"; 
var gazno = "43.13"; 
var hotyes = "27.76";
var hotno = "15.81"; 
var coldyes = "31.00";
var coldno = "38.25";
var otop = "84.67";
var musor = "26.00";

function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && (charCode < 43 || charCode > 57))
            return false;

         return true;
      }



И другая задача состоит в том что бы результаты подсчета(в самом калькуляторе), сохранить как скриншот либо что то наподобии истории в личный кабинет, подскажите как лучше реализовать такую задачу!? Буду благодарен!
Ответить с цитированием
  #2 (permalink)  
Старый 11.05.2015, 10:57
Аватар для Leon-on12
Аспирант
Отправить личное сообщение для Leon-on12 Посмотреть профиль Найти все сообщения от Leon-on12
 
Регистрация: 07.04.2015
Сообщений: 65

Первое что приходит в голову это localStorage.
Со скриншотом подсказать не могу. Но могу предложить значения калькулятора записывать в localStorage. И при заходе в личный кабинет загружать localStorage соответствующего пользователя ему на компьютер. Или на оборот при регистрации.
Ответить с цитированием
  #3 (permalink)  
Старый 11.05.2015, 20:16
Интересующийся
Отправить личное сообщение для dark_mc Посмотреть профиль Найти все сообщения от dark_mc
 
Регистрация: 10.05.2015
Сообщений: 13

Я конечно извиняюсь за столь глупый вопрос, но localStorage к каждому вару отдельно нужно привязать? если да,то как связать их, при попытке связать их у меня он не работает.

вот к примеру:
задал поле где будет вводиться значение, присвоил id
<section>
  <form id="form" action="#" method="POST">
  <input id="svet" name="svet" type="text" />
  <input id="svetno" name="svetno" type="text" /> 
</form>
</section>

сам скрипт где задано все
var svet= "0.32300"; 
var svetno= "63";
var gazyes = "1.7880"; 
var gazno = "43.13"; 
var hotyes = "27.76";
var hotno = "15.81"; 
var coldyes = "31.00";
var coldno = "38.25";
var otop = "84.67";
var musor = "26.00";

function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && (charCode < 43 || charCode > 57))
            return false;

         return true;
      }

и скрипт с localStorage:
if (window.localStorage) {
  var svet = document.querySelectorAll('[name]');

  for (var i = 0, length = elements.length; i < length; i++) {
    (function(svet) {
      var name = svet.getAttribute('name');

      svet.value = localStorage.getItem(name) || '';

      svet.onkeyup = function() {
        localStorage.setItem(name, svet.value);
      };
    })(svet[i]);
  }
}

или надо сам скрипт, где сами значения вписаны, туда и дописать localStorage? Честно запутался,облазил много сайтов с примерами, пробовал разные подходы но так ничего и не смог написать что бы работало.


Спасибо за ответ!

Последний раз редактировалось dark_mc, 11.05.2015 в 21:52.
Ответить с цитированием
  #4 (permalink)  
Старый 11.05.2015, 22:37
Аватар для Leon-on12
Аспирант
Отправить личное сообщение для Leon-on12 Посмотреть профиль Найти все сообщения от Leon-on12
 
Регистрация: 07.04.2015
Сообщений: 65

Вы как-то очень сложно действуете. Я предлагаю вам создать массив и записать в него все свои данные последовательно. И в localStorage поместить только этот массив.
Это проще чем крутить счётчики.
А так как у вас дискретный набор элеметнов, советую каждому элементу назначить своё конкретное место.
Тогда вам понадобиться всего одно место в localStorage.
Соответственно и с localStorage по сути работать не надо. Надо только загрузить в него свой массив по окончанию работы. Или выгрузить его из localStorage при начале работы.
Думаю что работать с массивом вам будет проще чем с элементами localStoragа.
Хотя понять почему ваше решение с назначением уникального ключа каждой переменной не работает, понять не могу.
----
А если обременить свой код обильными комментариями, или же просто после полной отладки заменять переменные на соответствующие элементы массива, то можно избежать кучи варов, но к сожалению тогда читаемость кода сильно снизиться.
Но если создать отдельный файлик где написать что на что меняется, и если не лень, то каждый раз можно проводить прямую или обратную замену, в зависимости от того что Вы собираетесь делать, запускать или редактировать код.

В качестве упражнения, и когда задолбает проводить замену, а от самого калькулятора будет кипеть мозг, можно отвлечься написанием автоматического заменителя всех варов на соответствующие элементы массива при запуске кода.

Последний раз редактировалось Leon-on12, 11.05.2015 в 22:50.
Ответить с цитированием
  #5 (permalink)  
Старый 11.05.2015, 23:10
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

Сообщение от Leon-on12 Посмотреть сообщение
не работает, понять не могу.
elements.length
Ответить с цитированием
  #6 (permalink)  
Старый 12.05.2015, 08:03
Профессор
Отправить личное сообщение для tsigel Посмотреть профиль Найти все сообщения от tsigel
 
Регистрация: 12.12.2012
Сообщений: 1,398

Сообщение от dark_mc
И другая задача состоит в том что бы результаты подсчета(в самом калькуляторе), сохранить как скриншот либо что то наподобии истории в личный кабинет, подскажите как лучше реализовать такую задачу!? Буду благодарен!
Есть библиотека html2canvas, может сделать скрин не сложной верстки, но сохранить без сервера не получится.
Ответить с цитированием
  #7 (permalink)  
Старый 12.05.2015, 15:28
Интересующийся
Отправить личное сообщение для dark_mc Посмотреть профиль Найти все сообщения от dark_mc
 
Регистрация: 10.05.2015
Сообщений: 13

Сообщение от Leon-on12 Посмотреть сообщение
не работает, понять не могу.
Сообщение от Rise Посмотреть сообщение
elements.length
Все исправил, долбал код с утра, значение не заменяет, даже не знаю почему,смотрел связь между кодом калькулятора, localStorage и конечно же там где все задано, может кто то поможет понять почему оно не работает? массив я не создавал потому что будет не понятно что до чего, мне проще как новичку все по отдельности,а не в кучу, дальше уже по ходу изучения языка буду пробовать ставить массивы.

код:
//поле для ввода нового значения
<section>
  <form id="form" action="#" method="POST">
  <input id="svet" name="svet" type="text" />
</form>
</section>
//поле для калькулятора
<table class="style12" style="width: 138px; "> 
            <tbody> 
              <tr> <td>Электричество</td> </tr>
              </tbody>
            </table>
            </td> <td> 
            <table class="style12" style="width: 183px; "> 
            <tbody> 
              <tr> <td> <input id="sS" style="width: 120px; " type="text" onfocus="changeFlag(0);" onkeyup="CalcSum(1);" onkeypress="return isNumberKey(event)">$</td> </tr>
             
              <tr> <td> <input id="sE" type="text" style="width: 120px; " onfocus="changeFlag(1)" ;="" onkeyup="CalcSum(1);" onkeypress="return isNumberKey(event)">квт</td> </tr>
             </tbody>
           </table>
         </td> <td> 
          <table> 
            <tbody> 
              <tr><td>Количество месяцев</td></tr>
             
              <tr><td> <select id="selS" name="D4" onchange="CalcSum(1);"> 
			           <option value="1">1</option> 
					   <option value="2">2</option> 
					   <option value="3">3</option> 
					   <option value="4">4</option> 
					   <option value="5">5</option> 
					   <option value="6">6</option> 
					   <option value="7">7</option> 
					   <option value="8">8</option> 
					   <option value="9">9</option> 
					   <option value="10">10</option> 
					   <option value="11">11</option> 
					   <option value="12">12</option> 
					   </select></td></tr>
              </tbody>
             </table>
         </td> <td><span id="sv"></span><select id="Sel1" name="D4" onchange="CalcSum(1);Show(1);"> 
		 <option value="0">Обычный дом</option> 
		 <option value="1">Дом с электроплитами</option> 
		 </select></td> 
		 <td> &nbsp;</td> </tr>


var svet= "0.32300"; 
var svetno= "63";
var gazyes = "1.7880"; 
var gazno = "43.13"; 
var hotyes = "27.76";
var hotno = "15.81"; 
var coldyes = "31.00";
var coldno = "38.25";
var otop = "84.67";
var musor = "26.00";

function isNumberKey(evt)
      {
         var charCode = (evt.which) ? evt.which : event.keyCode
         if (charCode > 31 && (charCode < 43 || charCode > 57))
            return false;

         return true;
      }

localStorage:
if (window.localStorage) {
  var svet = document.querySelectorAll('[name]');

  for (var i = 0, length = svet.length; i < length; i++) {
    (function(svet) {
      var name = svet.getAttribute('name');

      svet.value = localStorage.getItem(name) || '';

      svet.onkeyup = function() {
        localStorage.setItem(name, svet.value);
      };
    })(svet[i]);
  }
}

код с калькулятора:
var flag = 0;

function changeFlag(index) {
    flag = index;
}

function Show(index) {
    switch (index) {
		case 1: 
            {
                var sn = document.getElementById('Sel1');
                var snVal = sn.options[sn.selectedIndex].value;
                if (snVal == 0) { document.getElementById('sv').innerHTML = svet; } 
                else if (snVal == 1) { document.getElementById('sv').innerHTML = svetno; } 
            } break;
}
}

function CalcSum(usluga) {
    if (flag == 1) {
        switch (usluga) {
            case 1:
                {
                document.getElementById("selS").disabled = false;
                var sE = document.getElementById('sE').value;
         
		var sn = document.getElementById('Sel1');
                var snVal = sn.options[sn.selectedIndex].value;
				
                var mes = document.getElementById('selS');
                var mesV = mes.options[mes.selectedIndex].value;

if (snVal == 0) { document.getElementById('sS').value = ((sE * svet) * mesV).toFixed(2); }
                else if (snVal == 1) { document.getElementById('sS').value = ((sE * svetno) * mesV).toFixed(2); }
				
            } break;
}
    }
    else if (flag==0) {
        switch (usluga) {
            case 1:
            {
                /*document.getElementById("selS").disabled = true;
                var sS = document.getElementById('sS').value;
                document.getElementById('sE').value = (sS / svet).toFixed(2);*/
				document.getElementById("selS").disabled = true;
                var sS = document.getElementById('sS').value;
                var sn = document.getElementById('Sel1');
                var snVal = sn.options[sn.selectedIndex].value;
                if (snVal == 0) { document.getElementById('sE').value = (sS / svet).toFixed(2); }
                else if (snVal == 1) { document.getElementById('sE').value = (sS / svetno).toFixed(2); }
            } break;
 }
    }
    var s = 0;
    
    if (document.getElementById('sS').value != null) { s = document.getElementById('sS').value; }
}

function GOS(index)
{
	switch (index) 
	{
        case 1:
		{
		   document.getElementById('sS').focus();
		} break;
		case 2:
		{
		   document.getElementById('sE').focus();
		} break;
}
}


Вот связал все,но почему то оно считает по тому значению, которое задано заранее в варе...как будто не происходит замена.

А может быть дело в библиотеке?
Ответить с цитированием
  #8 (permalink)  
Старый 12.05.2015, 15:29
Интересующийся
Отправить личное сообщение для dark_mc Посмотреть профиль Найти все сообщения от dark_mc
 
Регистрация: 10.05.2015
Сообщений: 13

Сообщение от tsigel Посмотреть сообщение
Есть библиотека html2canvas, может сделать скрин не сложной верстки, но сохранить без сервера не получится.
Пробовал,не получилось. Но я решил это гораздо проще, прикрепил кнопку для печати страницы и все работает)
Ответить с цитированием
  #9 (permalink)  
Старый 12.05.2015, 19:52
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

Сообщение от dark_mc Посмотреть сообщение
И так, задача состоит в том, что бы изменять значения скрипта на странице в отдельном окне, что бы не трогать сам код!
Трогать все равно придется так что смысла в отдельном окне нет.
Сообщение от dark_mc Посмотреть сообщение
А может быть дело в библиотеке?
Что за библиотека?

Последний раз редактировалось Rise, 12.05.2015 в 19:56.
Ответить с цитированием
  #10 (permalink)  
Старый 12.05.2015, 21:23
Интересующийся
Отправить личное сообщение для dark_mc Посмотреть профиль Найти все сообщения от dark_mc
 
Регистрация: 10.05.2015
Сообщений: 13

Сообщение от Rise Посмотреть сообщение
Трогать все равно придется так что смысла в отдельном окне нет.
Хорошо, пусть даже сам код изменится, но как сделать замену?
Сообщение от Rise Посмотреть сообщение
Что за библиотека?
jquery
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
PHP/AJAX скрипт "Нaселение мoегo гoрoдa oнлaйн" rustik-yes Работа 2 01.12.2014 22:53
Помогите сделать скрипт на java для подсчета процентов perfectum Серверные языки и технологии 2 15.02.2013 04:49
Почему скрипт не работает с данными, которые вернул другой скрипт? Rooner jQuery 3 20.09.2012 14:56
Скрипт подсчета страниц на сайте paveljava5 Общие вопросы Javascript 8 22.06.2010 10:55
добавление окошка в скрипт подсчета слов Гость Общие вопросы Javascript 10 11.03.2008 17:07