php - 通过 JavaScript 更改 3 个下拉值

Question

我正在使用下面的脚本，需要在前两个下拉列表的基础上更改 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>

当我在第一个下拉列表中选择“医学和生物医学手稿重写”时，需要更改该值。有什么建议现在该怎么办吗？它对于医学和生物医学手稿写作工作正常--谢谢

Answer 1

这是一个可以用作 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
}