编写select下拉框的几种方式

<select>
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

value属性的值就是传入后台可接收到的值。
若要使下拉框默认选中：checked属性设置为true，也可在js中设置，$(“xxx”).prop(“checked”, true);

当要从数据库中动态获取数据来显示到下拉框中，有时候要显示name，但传入后台的是id，就有点难办了。

<select id="storeId" name="storeid" datatype="*" nullmsg="请选择劵类型">
    <option value="">商店名称</option>
    <c:forEach items="${list}" var="list">
        <option id="storeOption_${list.ID }" value="${list.ID }" areaCode="${list.AREACODE }">${list.STORENAME }</option>
    </c:forEach>
</select>

这种方式是用c标签的循环，加上EL表达式的方式动态显示出来。

$("#storeId").change(function() {
    $("#eMapId").val($("#storeOption_" + $(this).val()).attr("areaCode"));
});

当select的值发生改变时，eMapId也相应的改变。

这种方式党对起来比较复杂，可以用另一种框架：jQuery easyui

<td><input id="operatorInfo_storeName" class="easyui-combobox" url="common/operator/getstorename" editable="false" panelHeight="auto" valueField="id" textField="text" prompt="请选择所属门店"/></td>

class属性必须指定为easyui-combobox
url的地址为取得id 和 text 的action地址
valueField 和 textField 属性的值必须和后台返回的参数名称相对应
editable=”false”不可编辑， panelHeight=”auto”设置下拉框的长度自动适应

但是用这个框架要特别注意到的是，在用ajax提交的时候，若获取textField的值必须这样：

var storeId = $("#operatorInfo_storeName").combobox("getValue");

如果涉及到修改，要获取当前选择的行的数据，并使下拉框默认选中某个属性

$("#operatorInfo_storeName").combobox("setValue", row.STOREID);