jquery - 使用jQuery根据选择值更改隐藏字段值

Question

我正在尝试根据用户从下拉菜单中选择的内容更改隐藏的表单值。

这是我的 jQuery 代码：

$("#color").change(function() {
    if ($(this).val() == "black" ) {
        $("#id").val("21");
    } else if ($(this).val() == "white" ) {
        $("#id").val("22");
    }
});

这是我的表单html：

<form class="addToCart" id="addToCart" name="addToCart" action="/cart/add">
    <input type="hidden" id="id" name="id" value="21">
    <input type="hidden" id="name" name="name" value="Tank Top">
    <table width="100%" border="0" cellspacing="0" cellpadding="2">
        <tr>
            <td align="center"><span class="pink-font">Color</span></td>
            <td align="center"><span class="pink-font">Size</span></td>
            <td align="center"><span class="pink-font">Qty</span></td>
            <td align="center">&nbsp;</td>
        </tr>
        <tr>
            <td align="center">
                <select id="color" name="color">
                    <option value="black" selected="selected">Black</option>
                    <option value="white">White</option>
                </select>
            </td>

谁能指出我正确的方向。我似乎无法让它工作。

Answer 1

这是我使用的代码：

$(function() {
    $("#color").change(function() {
        if (this.value == "black") {
            $("#id").val("21");
        } else if (this.value == "white") {
            $("#id").val("22");
        }
    });
});