Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Калькулятор стоимости (https://javascript.ru/forum/css-html/32524-kalkulyator-stoimosti.html)

M@shroom 19.10.2012 11:09

Калькулятор стоимости
 
Добрый день, форумчане!
сразу оговорка - я в javascript новичок, поэтому прошу на глупые вопросы хотябы отвечать, а не слать в гугл.

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

#1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type='text/javascript'>
function validate() {
	var agregat1="рег1";
	var agregat2="рег2";
	var agregat3="рег3";
	var agregat4="рег4";
  //Считываем значения поля kvadratura в переменную j_kvadratura
  var j_kvadratura=document.forms["form"]["kvadratura"].value;
  //прописываем условия для выбора регистратора
  if ((j_kvadratura<=200) && (j_kvadratura>=50)) {
    document.write(рег4);
  }
  else if ((j_kvadratura<=400) && (j_kvadratura>=200)) {
    document.write(рег1);
  } 
  else if ((j_kvadratura<=600) && (j_kvadratura>=400)) {
    document.write(рег2);
  }
  else if ((j_kvadratura<=1000) && (j_kvadratura>=600)) {
    document.write(рег3);
  }
  else {document.write('Неверно введена квадратура');
  }
} 
</script>
</head>
<form name="form">
квадратура: <input type="text" name="kvadratura"><br />
<br /><input type="button" value="111" onclick="validate()">
</form>

<body>
</body>
</html>


Мне нужно будет считать стоимость услуг, как начать?
Я добился того что скрипт в зависимости от введенного в input значения выбирает регистратор. Как теперь добиться того, чтобы к этому регистратору привязывалась его цена?

#2
Как мне вывести результат именно в том месте, где мне надо, например в DIV?

vashurin 19.10.2012 13:04

Цитата:

Сообщение от M@shroom (Сообщение 211168)
Как мне вывести результат именно в том месте, где мне надо, например в DIV?

http://javascript.ru/tutorial/dom/intro#innerhtml

M@shroom 19.10.2012 13:24

Пардон, но не понятно.
Допустим, я хочу вывести результат выполнения функции validate() в тег <div></div>
мне в div писать innerHTML, или куда?

vashurin 19.10.2012 13:52

Цитата:

Сообщение от M@shroom (Сообщение 211179)
Пардон, но не понятно.
Допустим, я хочу вывести результат выполнения функции validate() в тег <div></div>
мне в div писать innerHTML, или куда?

<html>
<head>
<title>!!!</title>
<script>
function t(){
document.getElementById('another_id').innerHTML = document.getElementById('someid').value;
}
</script>
</head>
<body>

<input type="text" value="Напиши сюды!" id="someid"/><input type="button" value="Ткни сюды!" onclick="t()"/>
<div id="another_id"></div>
</body>
</html>

M@shroom 19.10.2012 14:54

Цитата:

Сообщение от vashurin (Сообщение 211189)
<html>
<head>
<title>!!!</title>
<script>
//объявляем функцию без переменных
function t(){
//приравниваем переменную another_id к someid
document.getElementById('another_id').innerHTML = document.getElementById('someid').value;
}
</script>
</head>
<body>
//создаем поле для ввода текста
<input type="text" value="Напиши сюды!" id="someid"/>
//создаем кнопку, которая вызывает функцию t()
<input type="button" value="Ткни сюды!" onclick="t()"/>
//выводим значение переменной another_id
<div id="another_id"></div>
</body>
</html>

так?

Только вот в моем примере есть 4 условия, мне нужно не просто вывод переменной, а вывести результат работы фунцкии... немогу...

Цитата:

сразу оговорка - я в javascript новичок
:)

vashurin 19.10.2012 15:02

Цитата:

Сообщение от M@shroom;
Только вот в моем примере есть 4 условия, мне нужно не просто вывод переменной, а вывести результат работы фунцкии... немогу...

Ну что же вам мешает сделать, например так:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type='text/javascript'>
function validate() {
        var result = 'Неверно введена квадратура';
	var agregat1="рег1";
	var agregat2="рег2";
	var agregat3="рег3";
	var agregat4="рег4";
  //Считываем значения поля kvadratura в переменную j_kvadratura
  var j_kvadratura=document.forms["form"]["kvadratura"].value;
  //прописываем условия для выбора регистратора
  if ((j_kvadratura<=200) && (j_kvadratura>=50)) {
    result = agregat4;
  }
  else if ((j_kvadratura<=400) && (j_kvadratura>=200)) {
    result = agregat1;
  } 
  else if ((j_kvadratura<=600) && (j_kvadratura>=400)) {
    result = agregat2;
  }
  else if ((j_kvadratura<=1000) && (j_kvadratura>=600)) {
    result = agregat3;
  }
  document.getElementById('result').innerHTML = result;
} 
</script>
</head>
<body>
<form name="form">
квадратура: <input type="text" name="kvadratura"><br />
<br /><input type="button" value="111" onclick="validate()">
</form>
<div id="result"></div>

</body>
</html>

Это это основы программирование. А вывод результата, это задача одной функции в любом языке программирования...

M@shroom 19.10.2012 15:11

Ничего не мешает! Класс! Спасибо большое!

Цитата:

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

Your 22.10.2012 05:25

vashurin, а что если там будут до миллиона числа, вы также насильно заставите?)

vashurin 22.10.2012 09:31

Цитата:

Сообщение от Your (Сообщение 211556)
vashurin, а что если там будут до миллиона числа, вы также насильно заставите?)

:) Пусть M@shroom сам придумает алгоритм и реализацию выборки вариантов :). Как я писал выше, все это основы программирования, не имеющие отношения к какому то конкретному языку.
На вопрос, касающийся реализации в конкретном языке:
Цитата:

Как мне вывести результат именно в том месте, где мне надо, например в DIV?
Ответ я дал даже с примером :)

Your 22.10.2012 11:49

var agregat1="рег1 200 500";

Ну можно делать и оригинальнее как-то)
Массивом например.


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