今天在利用jQuery動態設置下拉列表的值的時候確怎么也賦值不上去，其中用到了layui框架，源代碼如下:
$.post(contextPath+'/courseLibrary/getCourseBaseInfoById.do',{"courseId":courseId},function (courseInfoBack) {
// initSelectValue("[name='courseplatform']",courseInfoBack.courseplatform);
$("[name='courseid']").val(courseInfoBack.courseid);//向隱藏的課程主鍵賦值
$("[name='coursenum']").val(courseInfoBack.coursenum);
$("[name='courseplatform'] option[value='"+courseInfoBack.courseplatform+"']").attr("selected","true");
$("[name='coursenamecn']").val(courseInfoBack.coursenamecn);
$("[name='coursenameen']").val(courseInfoBack.coursenameen);
$("[name='coursenature'] option[value='"+courseInfoBack.coursenature+"']").attr("selected","true");
$("[name='credit']").val(courseInfoBack.credit);
$("[name='coursehour']").val(courseInfoBack.coursehour);
$("[name='teachhour']").val(courseInfoBack.teachhour);
$("[name='experimenthour']").val(courseInfoBack.experimenthour);
$("[name='computerhour']").val(courseInfoBack.computerhour);
$("[name='practicehour']").val(courseInfoBack.practicehour);
$("[name='weeklyhour']").val(courseInfoBack.weeklyhour);
$("[name='coursehourmethod'] option[value='"+courseInfoBack.coursehourmethod+"']").attr("selected","true");
$("[name='scoringway'] option[value='"+courseInfoBack.scoringway+"']").attr("selected","true");
},'json')
后來查看頁面源碼發現option確實多了selected屬性，可是由於使用了layui，layui將selected包裝為dl與dd,所以我們看到的會失效:
解決辦法:（更新渲染）
layui的 Form模塊的自動化渲染是會對其失效的。雖然我們沒有雙向綁定機制， 但沒有關系，你只需要執行 form.render(type, filter); 方法即可。
第一個參數：type，為表單的type類型，可選。默認對全部類型的表單進行一次更新。可局部刷新的type如下表：
| 參數（type）值 | 描述 |
|---|---|
| select | 刷新select選擇框渲染 |
| checkbox | 刷新checkbox復選框（含開關）渲染 |
| radio | 刷新radio單選框框渲染 |
form.render(); //更新全部 form.render('select'); //刷新select選擇框渲染 //……
第二個參數：filter，為 class="layui-form" 所在元素的 lay-filter="" 的值。你可以借助該參數，對表單完成局部更新。
【HTML】 <div class="layui-form" lay-filter="test1"> … </div> <div class="layui-form" lay-filter="test2"> … </div> 【JavaScript】 form.render(null, 'test1'); //更新 lay-filter="test1" 所在容器內的全部表單狀態 form.render('select', 'test2'); //更新 lay-filter="test2" 所在容器內的全部 select 狀態 //……
參考:http://www.layui.com/doc/modules/form.html#render
因此上述代碼改為:
$.post(contextPath+'/courseLibrary/getCourseBaseInfoById.do',{"courseId":courseId},function (courseInfoBack) {
// initSelectValue("[name='courseplatform']",courseInfoBack.courseplatform);
$("[name='courseid']").val(courseInfoBack.courseid);//向隱藏的課程主鍵賦值
$("[name='coursenum']").val(courseInfoBack.coursenum);
$("[name='courseplatform'] option[value='"+courseInfoBack.courseplatform+"']").attr("selected","true");
$("[name='coursenamecn']").val(courseInfoBack.coursenamecn);
$("[name='coursenameen']").val(courseInfoBack.coursenameen);
$("[name='coursenature'] option[value='"+courseInfoBack.coursenature+"']").attr("selected","true");
$("[name='credit']").val(courseInfoBack.credit);
$("[name='coursehour']").val(courseInfoBack.coursehour);
$("[name='teachhour']").val(courseInfoBack.teachhour);
$("[name='experimenthour']").val(courseInfoBack.experimenthour);
$("[name='computerhour']").val(courseInfoBack.computerhour);
$("[name='practicehour']").val(courseInfoBack.practicehour);
$("[name='weeklyhour']").val(courseInfoBack.weeklyhour);
$("[name='coursehourmethod'] option[value='"+courseInfoBack.coursehourmethod+"']").attr("selected","true");
$("[name='scoringway'] option[value='"+courseInfoBack.scoringway+"']").attr("selected","true");
layui.use(['form'], function () {
$ = layui.jquery;
var form = layui.form;
form.render(); //刷新select選擇框渲染
});
},'json')
最后再次查看源代碼:
