Показать сообщение отдельно
  #2 (permalink)  
Старый 28.02.2012, 23:52
Аватар для rashid86
Интересующийся
Отправить личное сообщение для rashid86 Посмотреть профиль Найти все сообщения от rashid86
 
Регистрация: 07.03.2010
Сообщений: 16

Вот например я хотел сделать на подобе этого калькулятора, но неполучился(
<table>
  <tr>
    <td width="319">Выезд проектировщика-оценщика</td>
    <td align="center"><input type="checkbox" id="b1" /></td>
  </tr>
</table>
<table class="table" border="1">
  <tr>
    <td width="319">Низкое давление - до 5 кПа (0,05 кгс/см2)</td>
    <td align="center"><input type="checkbox" class="platform" id="a1" /></td>
  </tr>
  <tr>
    <td>Среднее давление - до 0,3 мПа (3 кгс/см2)</td>
    <td align="center"><input type="checkbox" class="platform" id="a2" /></td>
  </tr>
  <tr>
    <td>Высокое давление - до 0,6 мПа (6 кгс/см2)</td>
    <td align="center"><input type="checkbox" class="platform" id="a3" /></td>
  </tr>
  <tr>
    <td>Высокое давление - до 1,2 мПа (12 кгс/см2)</td>
    <td align="center"><input type="checkbox" class="platform" id="a4" /></td>
  </tr>
</table>
<table>
  <tr>
    <td width="319">Рабочий проект</td>
    <td align="center"><input type="checkbox" id="d1" /></td>
  </tr>
</table>
<table>
  <tr>
    <td width="319">Получение тех.условие</td>
    <td align="center"><input type="checkbox" id="d2" /></td>
  </tr>
</table>
<table>
  <tr>
    <td width="319">Исполнительная Техническая Документация</td>
    <td><input type="checkbox" id="d3" /></td>
  </tr>
  <tr>
    <td width="246">Прокол через дорогу</td>
    <td><input type="checkbox" id="d4" /></td>
  </tr>
  <tr>
    <td>Сталь O 159</td>
    <td align="center"><input id="e1" class="numfield" maxlength="5" value="0" /></td>
    <td>метров</td>
  </tr>
  <tr>
    <td>Сталь O 57</td>
    <td align="center"><input id="e2" class="numfield" maxlength="5" value="0" /></td>
    <td>метров</td>
  </tr>
  <tr>
    <td>Сталь O 20</td>
    <td align="center"><input id="e3" class="numfield" maxlength="5" value="0" /></td>
    <td>метров</td>
  </tr>
  <tr>
    <td>Сталь O 15</td>
    <td align="center"><input id="e4" class="numfield" maxlength="5" value="0" /></td>
    <td>метров</td>
  </tr>
  <tr>
    <td>Полиэтилен O 32</td>
    <td align="center"><input id="e5" class="numfield" maxlength="5" value="0" /></td>
    <td>метров</td>
  </tr>
  <tr>
    <td>Выход труб из земли</td>
    <td align="center"><input id="e6" class="numfield" maxlength="5" value="0" /></td>
    <td>штук</td>
  </tr>
  <tr>
    <td>Котел</td>
    <td align="center"><input id="e7" class="numfield" maxlength="5" value="0" /></td>
    <td>штук</td>
  </tr>
  <tr>
    <td>Газовая плита</td>
    <td align="center"><input id="e8" class="numfield" maxlength="5" value="0" /></td>
    <td>штук</td>
  </tr>
  <tr>
    <td>Печь</td>
    <td align="center"><input id="e9" class="numfield" maxlength="5" value="0" /></td>
    <td>штук</td>
  </tr>
  <tr>
    <td>Водонагреватель (бойлер)</td>
    <td align="center"><input id="e10" class="numfield" maxlength="5" value="0" /></td>
    <td>штук</td>
  </tr>
  <tr>
    <td>Проход через стену</td>
    <td align="center"><input id="e11" class="numfield" maxlength="5" value="0" /></td>
    <td>штук</td>
  </tr>
  <tr>
    <td>Длина копки траншеи (м)</td>
    <td align="center"><input id="e12" class="numfield" maxlength="5" value="0" /></td>
    <td>метров</td>
  </tr>
</table>
<table class="table" border="1">
  <tr>
    <td width="319">Счетчик G4 (0,04 м3/ч до 6,0 м3/ч)</td>
    <td align="center"><input type="checkbox" class="platform2" id="f1" /></td>
  </tr>
  <tr>
    <td>Счетчик G6 (6,0 м3/ч до 10,0 м3/ч)</td>
    <td align="center"><input type="checkbox" class="platform2" id="f2" /></td>
  </tr>
  <tr>
    <td>Счетчик G10 (10,0 м3/ч до 16,0 м3/ч)</td>
    <td align="center"><input type="checkbox" class="platform2" id="f3" /></td>
  </tr>
  <tr>
    <td>Счетчик G16 (16,0 м3/ч до 25,0 м3/ч)</td>
    <td align="center"><input type="checkbox" class="platform2" id="f4" /></td>
  </tr>
  <tr>
    <td>Счетчик G25 (25,0 м3/ч до 40,0 м3/ч)</td>
    <td align="center"><input type="checkbox" class="platform2" id="f5" /></td>
  </tr>
</table>
<table class="table">
  <tr>
    <td width="319">ИТОГО:</td>
    <td id="total">0</td>
    <td>тенге</td>
  </tr>
</table>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> 
<script type="text/javascript">
var prices = {"a1":80,"a2":120,"a3":200,"a4":300,"b1":0,"d1":5,"d2":3,"d3":50,"d4":5,"e1":3,"e2":2,"e3":1,"e4":0.5,"e5":2,"e6":0.9,"e7":0.3,"e8":0.3,"e9":0.3,"e10":0.3,"e11":1,"e12":0.1,"f1":3,"f2":5,"f3":7,"f4":9,"f5":11};

$(document).ready (function() {
	$('input.platform').click (function() {
		if ($(this).attr ('checked')) {
			$('input.platform').attr ('checked', false);
			$(this).attr ('checked', true);}
			{
			$('input.platform2').attr ('checked', false);
			$(this).attr ('checked', true);}
	});
	
	$('input.animation').click (function() {
		if ($(this).attr ('checked')) {
			$('input.animation').attr ('checked', false);
			$(this).attr ('checked', true);
		}
	});
	
	$('input').click (function() {
		check_total();
	});
	
	$('.numfield').keyup (function() {
		var val = $(this).val().replace (/[^0-9]+/g, '');
		$(this).val (val);
		check_total();
	}).blur (function() {
		if ($(this).val() == '') {
			$(this).val (0);
		}
	});
	
	check_total();
});

function check_total()
{
	var sum = 0;
	$('input:checked').each (function() {
		sum += prices[$(this).attr ('id')];
	});
	$('.numfield').each (function() {
		sum += prices[$(this).attr ('id')] * $(this).val();
	})
	$('#total').html (number_format (sum * 1000, 0, '', ' '));
}

function number_format (number, decimals, dec_point, thousands_sep) {
    number = (number + '').replace(',', '').replace(' ', '');
    var n = !isFinite(+number) ? 0 : +number,
        prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
        sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
        dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
        s = '',
        toFixedFix = function (n, prec) {
            var k = Math.pow(10, prec);
            return '' + Math.round(n * k) / k;
        };
    s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
    if (s[0].length > 3) {
        s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
    }
    if ((s[1] || '').length < prec) {
        s[1] = s[1] || '';
        s[1] += new Array(prec - s[1].length + 1).join('0');
    }
    return s.join(dec);
}

</script>

Пример:
http://gumarika.ucoz.org/index/orien...ost_uslugi/0-6
Что то типа такого замутить...

Ну можно например объединить 2 скрипта с исходном html в один скрипт, например тут:
http://www.nakedart.ru/about-studio/calculator.html
и тут +
http://pnz.internet.it-consult.su/onlinecalculator.html
тоесть соединить 3 типа расчета в один скрипт, в одну страничку))
1) чекбокс (типа выбор услуг "да" или "нет"
2) многострочный список "несколько вариантов из данной услуги"
3) поле ввода чисел "колличество, штук"
и общая сумма в поле ввода или на голой страничке...

Последний раз редактировалось rashid86, 29.02.2012 в 00:09. Причина: пояснение
Ответить с цитированием