下拉选定索引更改的Java脚本
[英]java script for a drop down selected index change
问题描述
i 2 Dropdown controls and 1 text box In drop down1 one i have the values like 11.00,11.30,12.00,12.30,13.00, 13.30 In drop down2 one i have the values like 11.30,12.00,12.30,13.00, 13.30, 14.00 
i 2下拉控件和1个文本框在dropdown1中，一个i的值类似于11.00,11.30,12.00,12.30,13.00，13.30在dropdown2中，一个i的值诸如11.30,12.00,12.30,13.00，13.30，14.00
once the user selects the values in drop down 1 and drop down 2 an event will fires in drop down 2. where the selected vales from drop down 1 and drop down 2 are taken. 一旦用户在下拉列表1和下拉列表2中选择值，就会在下拉列表2中触发一个事件。从下拉列表1和下拉列表2中选择的值将被获取。 the dropdown1 value is subtracted from dropdown2 value . 从dropdown2值中减去dropdown1值。
if condition comes like 11.30 - 11.00= .30 if .30 is the result it should be shown as .50 as a result in text box if condition comes like 11.00 - 10.30= .70 if .70 is the result it should be shown as .50 as a result in text box 如果条件如11.30-11.00 = .30如果结果为.30，则应在文本框中显示为.50，如果条件如11.00-10.30 = .70如果结果为.70，则应显示为.50结果在文本框中
this condition should as work in javascript 这种情况应在javascript中工作
if any one know s how to do it, help me out thank you 如果有人知道怎么做，请帮帮我，谢谢
3 个解决方案
解决方案1
1 2009-09-17 10:12:59
add 'onchange="calculate()"' in your dropdown 2 add this javascript function 在下拉菜单2中添加'onchange =“ calculate（）”'，添加此javascript函数
function calculate()
{
var dropdown1 = document.getElementById('dropdown1')
var dropdown2 = document.getElementById('dropdown1')
var textbox = document.getElementById('textbox')
var a = dropdown1.options[dropdown1.selectedIndex]
var b = dropdown2.options[dropdown2.selectedIndex]
if((a -b) == what ever you want)
textbox.value = what ever you want
else if((a -b) == what ever you want)
textbox.value = what ever you want
}
解决方案2
0 2009-09-17 10:26:41
Code in jQuery without the replacing part. jQuery中没有替换部分的代码。 I am not sure about your 2 conditions. 我不确定您的2个条件。 do you want to always show .50 if the result is .30 or .70. 如果结果是.30或.70，是否要始终显示.50？
Updated 更新
<script>
$(document).ready ( function () {
$("#sel1").change ( function () {
CalcResult ();
});
$("#sel2").change ( function () {
CalcResult ();
});
function CalcResult ()
{
var resultVal = parseFloat ( $("#sel2 option:selected").val() ) - parseFloat ( "#sel1 option:selected").val() );
var resultVal = $("#sel2 option:selected").val() - $("#sel1 option:selected").val();
resultVal = resultVal.toFixed("2").toString().replace ( ".30" , ".50" ).replace(".70" , ".50" );
$("#txt1").val(resultVal.toFixed("2"));
}
});
</script>
<body>
<select id="sel1">
<option value="11.00">11.00</option>
<option value="11.30">11.30</option>
<option value="12.00">12.00</option>
<option value="12.30">12.30</option>
<option value="13.00">13.00</option>
<option value="13.3">13.30</option>
</select>
<select id="sel2">
<option value="11.30">11.30</option>
<option value="12.00">12.00</option>
<option value="12.30">12.30</option>
<option value="13.00">13.00</option>
<option value="13.30">13.30</option>
<option value="14.00">14.0</option>
</select>
<input type="text" id="txt1" />
</body>
解决方案3
0 已采纳 2009-09-17 11:14:04
On a bit of a whim I decided that you want to calculate the difference between two times... Ignore me if it's not what you're after but I fancied doing it anyway. 一时兴起，我决定要计算两次之间的差...如果不是您想要的，请忽略我，但我还是想这样做。 To make it easier I set the values in the drop downs to number of minutes cos working with time in js can be a ball ache: 为了更容易，我将下拉列表中的值设置为cos在js中使用时间的分钟数可能会引起很大的痛苦：
<script type="text/javascript">
$(document).ready(function() {
//Calculate the difference when second ddl changes
$("#ddl2").change(function() {calculateTimeDiff();});
});
function calculateTimeDiff() {
//get the values
var time1 = $("#ddl1").val();
var time2 = $("#ddl2").val();
//check everything is in the right state to do the calc
if(time1 > time2) {
alert("time 1 must be before time 2");
}
else {
//get the number of mins difference
var minsDiff = (time2 - time1);
//remove number of hours (60 min chunks)
minsDiff = minsDiff % 60;
//get hours difference
var hoursDiff = time2 - time1 - minsDiff;
//if more than none, get the no of whole hours
if (hoursDiff > 0) {
hoursDiff = hoursDiff/60;
}
//format mins diff
if(minsDiff == 0) { minsDiff = "00"};
//add it to text box
$("#text1").val(hoursDiff + ":" + minsDiff);
}
}
</script>
<div id="example">
<select id="ddl1">
<option value="600">10:00</option>
<option value="630">10:30</option>
<option value="660">11:00</option>
<option value="690">11:30</option>
<option value="720">12:00</option>
</select>
<select id="ddl2">
<option value="630">10:30</option>
<option value="660">11:00</option>
<option value="690">11:30</option>
<option value="720">12:00</option>
<option value="750">12:30</option>
</select>
<input type="text" id="text1" />
</div>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.