Премини към съдържанието
  • Добре дошли!

    Добре дошли в нашите форуми, пълни с полезна информация. Имате проблем с компютъра или телефона си? Публикувайте нова тема и ще намерите решение на всичките си проблеми. Общувайте свободно и открийте безброй нови приятели.

    Моля, регистрирайте се за да публикувате тема и да получите пълен достъп до всички функции.

     

Архивирана тема

Темата е твърде стара и е архивирана. Не можете да добавяте нови отговори в нея, но винаги можете да публикувате нова тема, в която да продължи дискусията. Регистрирайте се или влезте във вашия профил за да публикувате нова тема.

NikolayTodorov

jQuery value from Select

Препоръчан отговор


Здравейте,

отново се обръщам към вас за помощ. Не съм програмист, а самоук и тепърва навлизащ.

Бих искал да направя проста, динамична калкулация, която да взима от един text field въведената стойност заедно със стойността от едно Select меню и да ги умножава.

Приложеният скрипт работи, но явно .keyup не съм го задал правилно т.к. така след първоначалната калкулация, при запазване на въведеното число, а само при промяна на друга стойност от Select-a не се променя крайния резултат. Трябва след избора новата стойност на селекта, да се повтори въвеждането на числото в първото поле а1, за да се промени крайният резултат

 

Благодаря ви предварително!

 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
$(document).ready(function(){
    $('input').keyup( function(){
        var a1 = $('#a1').val();
      var a3 = $('#v22').val();
        $('#first-result').text(parseInt(a1)*parseInt(a3));
    }); 
});
</script>
 
</script>
 
 
</head>
 
<body>
<table width="987">
    <tr>
        <td width="156"></td><td width="167"> a </td>
        <td width="246">&nbsp;</td>
        <td width="398">&nbsp;</td>
    </tr>
    <tr>
        <td>&nbsp;</td><td><input name="a1" id="a1" type="text"></td>
        <td><select name="v22" id="v22">
          <option value="0">Височина</option>
          <option value="10">10 см</option>
          <option value="20">20 см</option>
        </select></td>
     
    </tr>
</table>
 
<table>
    <tr>
      <td>&nbsp;</td>
    </tr>
    <tr>
        <td> Dynamic Result </td>
    </tr>
    <tr>
        <td id="first-result"> a1*а2 (to be calculated dynamically)</td>
    </tr>
 </table>
</body>
</html>
 

Сподели този отговор


Линк към този отговор
Сподели в други сайтове

Нямаш event на select-а - той работи с change. Трябва да си видиш във версията на jQuery, която ползваш, как най-добре е имплементиран този event.

Сподели този отговор


Линк към този отговор
Сподели в други сайтове

И така става:

<!DOCTYPE html><html>	<head>		<meta charset="utf-8">		<title>jQuery POWER </title>		<meta name="keywords" content="JavaScript, JS, jQuery">		<meta name="description" content="jQuery power test!">		<style>			body{				margin:0;				padding:0;				background:#eee;				font-family:Arial, Verdana;			}			#overallHeader{				margin:10px auto 0 auto;				padding:10px;				width:400px;				height:200px;				background:#ccc;				border:1px #aaa solid;			}			#theForm{				margin-bottom:5px;				padding:5px;				background:#eee;				border:1px #bbb solid;			}			input{				width:190px;			}			select{				width:190px;			}			button{				width:388px;			}			#theResult{				padding:5px;				width:388px;				height:119px;				background:#eee;				text-align:center;				border:1px #bbb solid;							}			#yourResult{				color:red;				font-weight:bold;			}		</style>		<script src="jquery-1.11.0.min.js"></script>		<script>			$("document").ready(function(){				$("#action").click(function(){					var number = $("#theNumber").val();					var selection = $("#theSelection option:selected").val();					$("#yourResult").text(number * selection);				});						});		</script>	</head>	<body>		<div id="overallHeader">			<div id="theForm">				<input type="text" id="theNumber">				<select name="v22" id="theSelection">					<option value="0">Височина</option>					<option value="10">10 см</option>					<option value="20">20 см</option>				</select>				<button id="action">Изчисли </button>			</div>			<div id="theResult">				<p id="result">Резултатът е: <span id="yourResult"></span></p>			</div>		</div>	</body></html>

Edit: Не забелязах, че искаш да използваш keyup()...

<script>	$("document").ready(function(){		$("#theNumber").keyup(function(){			var number = $("#theNumber").val();			var selection = $("#theSelection option:selected").val();			if(parseInt(number)){				if(parseInt(selection)){					$("#yourResult").text(number * selection);				}else{					$("#yourResult").text("Избери височина!");				}			}else{				$("#yourResult").text("Въведи число!");			}		});	});</script>

Сподели този отговор


Линк към този отговор
Сподели в други сайтове

×
×
  • Добави ново...