input框默认选中当前登陆人用户集合和登陆人的ID比对选中所用框架JQ和thymeleaf
可以使用以下方法来实现:
- 在HTML页面中,使用Thymeleaf的
th:value属性将当前登录人的ID赋值给input框的value属性,这样在页面加载时,input框会默认选中该值。
<input type="text" id="userId" th:value="${loginUser.id}" />
- 在JavaScript代码中,使用JQuery的
val()方法获取input框的值,并与用户集合中的ID进行比对,如果匹配则选中该选项。
$(document).ready(function(){
var loginUser = $("#userId").val();
// 获取用户集合
var userList = [{id: 1, name: "User1"}, {id: 2, name: "User2"}, {id: 3, name: "User3"}];
// 遍历用户集合
$.each(userList, function(index, user) {
// 比对ID,如果匹配则选中
if (user.id == loginUser) {
$("#userSelect").append("<option value='" + user.id + "' selected='selected'>" + user.name + "</option>");
} else {
$("#userSelect").append("<option value='" + user.id + "'>" + user.name + "</option>");
}
});
});
- 在HTML页面中,使用Thymeleaf的
th:each属性将用户集合中的用户渲染成下拉选项。
<select id="userSelect">
<option value="">请选择用户</option>
</select>
注意:以上代码是一个简单示例,具体的实现方式需要根据你的页面结构和数据格式进行调整
原文地址: http://www.cveoy.top/t/topic/h91A 著作权归作者所有。请勿转载和采集!