Java Web 开发之 select(option)选项数据回显

后台代码：

// 后台取回显值列表
List<Role> roles = roleService.getAllRoles();
model.addAttribute("roles", roles);
// 后台取回显选中值列表
List<UserRole> userRoles = userService.getUserRoleByUserId(userId);
model.addAttribute("userRoles", userRoles);

第一种方式：

<!-- 前端用<c:if>标签判断并回显 -->
<select id="roleSelect" class="form-control" name="roleId">
	<c:forEach items="${roles}" var="role">
		<c:if test="${role.roleId == userRoles[0].roleId}">
			<option value="${role.roleId}" selected>${role.description}</option>
        </c:if>
        <c:if test="${role.roleId != userRoles[0].roleId}">
            <option value="${role.roleId}">${role.description}</option>
       	</c:if>
	</c:forEach>
</select>

第二种方式：

<!-- 用input标签从后台获取的选中的值 -->
<input type="hidden" id="roleId" value="${userRoles[0].roleId}"/>

/** 使用Jquery设置选中 */
$(function(){
	var roleId = $("#roleId").val();
	$("#roleSelect").val(roleId);    // 设置 value 为 roleId 的项选中
})