- jquery语法
图1代码实现了一个reset重置功能，涉及到的知识点有：
（1）jquery选择器：
①("#applicant")：使用
("[lay-value='请选择公司']")：使用
(".layui-form-checked")：使用
(this)：可以选择当前操作的元素。
（2）涉及到的jquery元素操作方法：
①("#applicant").val()：val()是元素赋值方法，也可以用于清空元素值（重置）；
③("this").removeClass("layui-form-checked")：removeClass()可以移除元素样式，addClass()可以添加元素样式。
// reset
$("#reset").click(function){
$("#applicant").val();
$("[lay-value='请选择公司']").trigger("click");
$(".layui-form-checked").each(function(){
// $(this).removeClass("layui-form-checked");
// 移除样式无用的情况下想到通过模拟再次click事件来取消选中
$(this).trigger("click");
})
}
图1
2.jquery语法
图2代码段实现了一个渲染文件列表的功能，包括文件下载、文件删除（删除后重新渲染文件列表），涉及到的知识点有：
（1）jquery选择器：(#fileTableCommon-template)元素id选择、
(".deleteBtn")元素样式选择、
("#descisionBasis").html(fileComponent)渲染元素、
(this).attr('data-name')获取元素属性值等。
（3）("#fileTableCommon-template").html())(model))。使用handlebars进行元素渲染。
（4）使用Ajax方式进行接口调用。（默认同步方式调用）
（5）window.location用于打开一个新窗口，splice()用于数组类型对象的分割。
function renderFileTable(){
$("#descisionBasis").html(fileComponent);
$("#descisionBasis").html(Handlebars.compile($("#fileTableCommon-template").html())(model));
// downloadFile
$(".downBtn").click(function(){
var fileId = $(this).attr('data-id');
var fileName = $(this).attr('data-name');
var downData = {
"body": {
"fileId": fileId,
"fileName": fileName
}
}
tools.postHttpRequest('/glcs/v1/download', downData, function(data){
window.location = data.body;
})
})
// deleteFile
$(".deleteBtn").click(function(){
var index = $(this).attr('data-index');
model.fileLists.splice(index,1);
renderFileTable();
})
}
图2
3.jquery与layui语法
①jquery选择器：("[lay-value='XX']").trigger("click")模拟click事件
③layui方法：form.on('select(filter)',function(){})，layui监听select下拉框选择。
// layui监听select的方式
form.on('select(filter)',function(){
// 通过模拟选中第一个option，使select恢复默认
$("[lay-value='XX']").trigger("click");
})
图3
4.如果弹出层的content是某个DOM元素的话，需要放在body根节点下，避免被遮罩
https://blog.csdn.net/q646926099/article/details/78797091（layer弹层遮罩挡住窗体解决）
