Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Посчитать выгоду между 3 чисел (https://javascript.ru/forum/css-html/44717-poschitat-vygodu-mezhdu-3-chisel.html)

yunis91 30.01.2014 14:11

Посчитать выгоду между 3 чисел
 
Задача такая: есть три radio в value которых записана цена товара, сумма выгоды выводилась в span,
первая 1299 вторая 1799 третья 799
страница загрузилась чекин стоит на первой, выбираем 2 radio выгода 0 после этого клиент передумал и выбрал 3 radio выгода должна быть рассчитана от предыдущего выбранного radio.
т е чекин стоял на 1299 - выгода 0
выбрали 799 выгода 500
выбрали 1799 выгода 0
выбрали снова 799 выгода 1000

вот кусок кода
<div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
			        <div class="infoprodukt">
			             <img src="img/disk.png">
			        </div>	
			   <h3 class="infoprodukt-podis">CD-диск</h3>
			            <div class="radio">
                            <input type="radio" name="radiog_infoprod" id="radio1" class="css-checkbox" checked="checked" value="1299">
							<label for="radio1" class="css-label">1299 руб.</label>
                        </div>
			   </div>
			   
			   <div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
			        <div class="infoprodukt">
			             <img src="img/flash.png">
			        </div>	
			   <h3 class="infoprodukt-podis">Флэш-карта</h3>
			   <div class="radio">
                            <input type="radio" name="radiog_infoprod" id="radio2" class="css-checkbox" value="1799">
							<label for="radio2" class="css-label">1799 руб.</label>
                        </div>
			   </div>
			   
			   <div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
			        <div class="infoprodukt">
			             <img src="img/onlinedown.png">
			        </div>	
			   <h3 class="infoprodukt-podis">Онлайн скачивание</h3>
			   <div class="radio">
                            <input type="radio" name="radiog_infoprod" id="radio3" class="css-checkbox" value="799">
							<label for="radio3" class="css-label">799 руб.</label>
                        </div>
			   </div>
.....
<h4>ваша выгода <span id="resultViq">0</span> руб.</h4>


var maxPrice = 0;

	$(document).ready(function() {
	var a = $('#radio1').val();
	var b = $('#radio2').val();
	var c = $('#radio3').val();	

		if( a > b && c )
		{
			maxPrice = a;
		}
		if( b > a && c )
		{
			maxPrice = b;
		}
		if( c > a && b )
		{
			maxPrice = c;
		}
	
	})

	$('#radio1:checked').live('click', function() {
		var a = $('#radio1').val();

		if ( maxPrice > a )
			{
				$('#resultViq').html(maxPrice - parseInt($('#radio1').val()));
			}
		else if ( maxPrice < a )
			{
				$('#resultViq').html('0');
			}
	})
	$('#radio2:checked').live('click', function() {
		var b = $('#radio2').val();

		if ( maxPrice > b )
			{
				$('#resultViq').html('0');
			}
		else if ( maxPrice < b )
			{
				$('#resultViq').html('0');
			}
	})
	$('#radio1:checked').live('click', function() {
		var c = $('#radio3').val();

		if ( maxPrice > c )
			{
				$('#resultViq').html(maxPrice - parseInt($('#radio3').val()));
			}
		else if ( maxPrice < c )
			{
				$('#resultViq').html('0');
			}
	})


данный мой метод как то не так работает, второй день ломаю голову...

ksa 30.01.2014 15:31

Цитата:

Сообщение от yunis91
второй день ломаю голову...

Зачем ты так убиваешся? Ты ведь так не убъешся... :no: (с)

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(function (){
	var old=$('.css-checkbox:checked').val();
	$('.css-checkbox').click(function (){
		var val=old-this.value;
		old=this.value;
		val=(val<0)? 0: val;
		$('#resultViq').text(val);
	});
});
</script>
</head>
<body>
<div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
	<div class="infoprodukt">
		<img src="img/disk.png">
	</div>	
	<h3 class="infoprodukt-podis">CD-диск</h3>
	<div class="radio">
		<input type="radio" name="radiog_infoprod" id="radio1" class="css-checkbox" checked="checked" value="1299">
		<label for="radio1" class="css-label">1299 руб.</label>
	</div>
</div>
<div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
	<div class="infoprodukt">
		<img src="img/flash.png">
	</div>	
	<h3 class="infoprodukt-podis">Флэш-карта</h3>
	<div class="radio">
		<input type="radio" name="radiog_infoprod" id="radio2" class="css-checkbox" value="1799">
		<label for="radio2" class="css-label">1799 руб.</label>
	</div>
</div>
<div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
	<div class="infoprodukt">
		<img src="img/onlinedown.png">
	</div>	
	<h3 class="infoprodukt-podis">Онлайн скачивание</h3>
	<div class="radio">
		<input type="radio" name="radiog_infoprod" id="radio3" class="css-checkbox" value="799">
		<label for="radio3" class="css-label">799 руб.</label>
	</div>
</div>
<h4>ваша выгода <span id="resultViq">0</span> руб.</h4>
</body>
</html>

Но верстка твоя просто ужос! :blink:

рони 30.01.2014 15:34

yunis91,
:cray:
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script>
 $(document).ready(function () {
     var maxPrice = 0,
         val = 0;
     $radiog = $('[name="radiog_infoprod"]');
     $('[name="radiog_infoprod"]').on("change", function () {
         maxPrice = +this.value;
         maxPrice = val > maxPrice ? val - maxPrice : 0;
         $("#resultViq").html(maxPrice);
         val = +this.value
     })
 });
  </script>
</head>

<body>
<div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
			        <div class="infoprodukt">
			             <img src="img/disk.png">
			        </div>
			   <h3 class="infoprodukt-podis">CD-диск</h3>
			            <div class="radio">
                            <input type="radio" name="radiog_infoprod" id="radio1" class="css-checkbox" checked="checked" value="1299" >
							<label for="radio1" class="css-label">1299 руб.</label>
                        </div>
			   </div>

			   <div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
			        <div class="infoprodukt">
			             <img src="img/flash.png">
			        </div>
			   <h3 class="infoprodukt-podis">Флэш-карта</h3>
			   <div class="radio">
                            <input type="radio" name="radiog_infoprod" id="radio2" class="css-checkbox" value="1799">
							<label for="radio2" class="css-label">1799 руб.</label>
                        </div>
			   </div>

			   <div class="col-lg-4 col-md-4 col-xs-12 col-sm-4 ">
			        <div class="infoprodukt">
			             <img src="img/onlinedown.png">
			        </div>
			   <h3 class="infoprodukt-podis">Онлайн скачивание</h3>
			   <div class="radio">
                            <input type="radio" name="radiog_infoprod" id="radio3" class="css-checkbox" value="799">
							<label for="radio3" class="css-label">799 руб.</label>
                        </div>
			   </div>
.....
<h4>ваша выгода <span id="resultViq">0</span> руб.</h4>

</body>

</html>

yunis91 31.01.2014 06:19

:thanks: большое спасибо!

yunis91 31.01.2014 06:56

у меня еще вопрос)
у меня там три таких подгрупп с radio
как в каждой просчитать также выгоду и складывать итоговую сумму в resultViq

ksa 31.01.2014 08:27

Цитата:

Сообщение от yunis91
как в каждой просчитать также выгоду

На то есть массивы или объекты - используй их.

Цитата:

Сообщение от yunis91
и складывать итоговую сумму в resultViq

Найти сумму в массиве или объекте вовсе просто... :D

yunis91 31.01.2014 08:42

а наглядно не подскажете?)
после суток голова не варит уже видимо...

yunis91 03.02.2014 06:32

ksa,
не поможешь реализовать?)

ksa 03.02.2014 08:27

Цитата:

Сообщение от yunis91
не поможешь реализовать?

Задачка вовсе букварская - не интересно...

yunis91 03.02.2014 14:23

ksa,
спасибо это сделал уже сам)
слушай а как сделать если у поля h4 есть id надо чтобы если выгода 0 то у id h4 присваивался display none


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