通过javascript更改3个下拉值
问题描述:
我正在使用下面的脚本,需要在前两个基础上更改3个下拉列表的值,目前它显示相同的值以改变第一个下拉列表中的值。这里是脚本---通过javascript更改3个下拉值
<script type="text/javascript">
function changeprice(id){
var value = id;
if(value == ""){
document.getElementById('price').value="";
alert("Please select one valid word count");
return false;
}
if(value == "Lessthan1000"){
var newprice = "USD 290";
}
if(value == "Lessthan2000"){
var newprice = "USD 540";
}
if(value == "Lessthan4000"){
var newprice = "USD 1050";
}
if(value == "Lessthan6000"){
var newprice = "USD 1900";
}
var eprice = newprice;
document.getElementById('price').value = eprice;
}
</script>
<select name="sp" id="sp" class="servicecategory">
<option value="" selected>Please Select...</option>
<option value="Medical and Biomedical Manuscript Writing" <?php if($servicename == "Medical and Biomedical Manuscript Writing"){ echo(" selected=\"selected\""); } ?>>Medical and Biomedical Manuscript Writing</option>
<option value="Medical and Biomedical Manuscript Rewriting" <?php if($servicename == "Medical and Biomedical Manuscript Rewriting"){ echo(" selected=\"selected\""); } ?>>Medical and Biomedical Manuscript Rewriting</option>
</select>
<select name="Word_Count" id="Word_Count" onChange="changeprice(this.value)">
<option value="" selected>Please Select...</option>
<option value="Lessthan1000">1 - 1000 words</option>
<option value="Lessthan2000">1001 - 2000 words</option>
<option value="Lessthan4000">2001 - 4000 words</option>
<option value="Lessthan6000">4001 - 6000 words</option>
</select>
<tr>
<td valign="top" align="right">Price:</td>
<td width="5"></td>
<td valign="top" align="left"><input type="text" name="price" id="price" value="" readonly="" size="20"><br /></td>
</tr>
需要改变的价值一旦我选择医疗和生物医学手稿重写在第一个下拉列表中。任何建议现在要做什么?为医学和生物医学手稿其做工精细writing--三江源
答
这里,你可以作为一个onchange
事件中使用的函数:
HTML(注意onchange事件):
<select name="sp" id="sp" class="servicecategory" onChange="change_select_values(this.value)">
JS:
function change_select_values(val){
var sel = document.getElementById('Word_Count');
switch(val){
case "Medical and Biomedical Manuscript Rewriting":
sel.options.length = 0; // clear select options
sel.options[0] = new Option('TEXT', 'VALUE');
sel.options[1] = new Option('TEXT', 'VALUE');
sel.options[2] = new Option('TEXT', 'VALUE');
sel.options[3] = new Option('TEXT', 'VALUE');
break;
default:
sel.options.length = 0;
sel.options[0] = new Option('1 - 1000 words', 'Lessthan1000');
sel.options[1] = new Option('1001 - 2000 words', 'Lessthan2000');
sel.options[2] = new Option('2001 - 4000 words', 'Lessthan4000');
sel.options[3] = new Option('4001 - 6000 words', 'Lessthan6000');
}
changeprice(sel.options[0].value); // change input value
}
它不工作,不改变它们的值和它们的价格。:( – user1859847
这只会改变第二个选择元素的选择选项。如果你w蚂蚁它改变输入(价格),然后我会添加'changeprice(sel.options [0] .value);'在函数的末尾。我将修改代码。 –
此外,您需要扩展“changeprice”函数以包含新选项值 –