更改一个下拉列表的值依赖于另一个下拉列表

Change value of one DropDownList depend on another one

本文关键字：下拉列表 依赖于 另一个 一个      更新时间：2023-09-26

我试图根据另一个下拉列表设置下拉列表的值:

<select id="workField :">
    <option value="HI-TEC">HI-TEC</option>
    <option value="Food Industry">Food Industry</option>
    <option value="Marketing">Marketing</option>
    <option value="Resturents">Resturents</option>
    <option value="Financial">Financial</option>        
</select>
<select id="occupetion">
    <option value="QA">QA</option>
    <option value="Food Industry">Food inspectur</option>
    <option value="Marketing">Selles man</option>
    <option value="Resturents">Bartender</option>
    <option value="Financial">Broker</option>
</select>

我的选择是什么?我试过了:http://jsfiddle.net/mplungjan/VSuBD/还是不行

使用如下代码:

$( "#workField" ).change(function() {
    if ($(this).val() == "HI-TEC"){
        $("#occupetion").val("QA");
    }
    if ($(this).val() == "Food Industry"){
        $("#occupetion").val("Food Industry");
    }
    if ($(this).val() == "Marketing"){
        $("#occupetion").val("Marketing");
    }
});


检查JSFiddle Demo


更新:
根据你的评论，似乎你有一些问题，如何使用这个代码，所以我包括一个完整的html页面代码希望是有帮助的。

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <title></title>
</head>
<body>
    <form id="form1">
        <div>
            <select id="workField">
                <option value="HI-TEC">HI-TEC</option>
                <option value="Food Industry">Food Industry</option>
                <option value="Marketing">Marketing</option>
            </select>
            <select id="occupetion">
                <option value="QA">QA</option>
                <option value="Food Industry">Food inspectur</option>
                <option value="Marketing">Selles man</option>
            </select>
        </div>
        <script>
            $("#workField").change(function () {
                if ($(this).val() == "HI-TEC") {
                    $("#occupetion").val("QA");
                }
                if ($(this).val() == "Food Industry") {
                    $("#occupetion").val("Food Industry");
                }
                if ($(this).val() == "Marketing") {
                    $("#occupetion").val("Marketing");
                }
            });
        </script>
    </form>
</body>
</html>
相关文章：