抉择所有子元素（排除最初一个）
element:not(:last-child) {}
自定义原生input="file"的款式
// 自定义上传款式<li id="upload-btn" class="default-image"> <img src="=" alt=""> <div>请上传图片</div> <!-- 上传(暗藏原生的input) --> <input type="file" id="upload" class="hide"></li>// 模仿原生input点击事件 $('#upload-btn').click(function() { $('#upload').click();})
attr()和prop()的区别
- attr示意HTML文档节点的属性，prop示意JS对象的属性
<!-- 这里的id、class、data-id均为div的attr --><div id="demo" class="demo" data-id="1"></div>
// 这里的name、age均为obj对象的proplet obj = { name: 'wen', age: 18}
- attr()底层依赖的是getAttribute()和setAttribute()两个办法，prop()依赖原生JS中的对象属性获取和设置形式。
- attr()是jQuery 1.0版本就有的函数，prop()是jQuery 1.6版本新增的函数
- 对于表单元素的checked、selected、disabled等属性，在jQuery 1.6之前，attr()获取这些属性的返回值为Boolean类型：如果被选中(或禁用)就返回true，否则返回false。
- 但从1.6开始，应用attr()获取这些属性的返回值为String类型，如果被选中(或禁用)就返回checked、selected或disabled，否则(即元素节点没有该属性)返回undefined。
- 在某些版本中，这些属性值示意文档加载时的初始状态值，即便之后更改了这些元素的选中(或禁用)状态，对应的属性值也不会产生扭转。因为jQuery认为：attribute的checked、selected、disabled就是示意该属性初始状态的值，property的checked、selected、disabled才示意该属性实时状态的值(值为true或false)。
- 因而，在jQuery 1.6及当前版本中，请应用prop()函数来设置或获取checked、selected、disabled等属性。对于其它可能用prop()实现的操作，也尽量应用prop()函数。
原生ajax导出二进制文件（文件流）
var url = `/export?start_time=${start_time}`;var xhr = new XMLHttpRequest();// 也能够应用POST形式，依据接口xhr.open("GET", url, true);// 返回类型blob，XMLHttpRequest反对二进制流类型xhr.responseType = "blob";xhr.onload = function () { if (this.status === 200) { //应用response作为返回，而非responseText var blob = this.response; var reader = new FileReader(); // 转换为base64，能够间接放入a标签href reader.readAsDataURL(blob); reader.onload = function (e) { // 转换实现，创立一个a标签用于下载 var a = document.createElement("a"); // 获取以后导出工夫 var nowDate = format(new Date()); a.download = `文件名_${nowDate}.xlsx`; a.href = e.target.result; a.click(); }; }};xhr.send();
jquery实现近程搜寻（模拟iview）
// -----------近程搜寻 start------------ // 近程搜寻接口门路 var searchUrls = ["/productManager/index"]; // 申请下拉列表 function remoteSearch(val, idx) { var that = $("#" + val + ""); $("#" + val + "-dropdown").show(); $("#select-" + val + "-id").val(""); var name = $(that).val().trim(); var data = { name }; $("#" + val + "-dropdown").html( '<div class="search-loading">加载中...</div>' ); $.ajax({ type: "GET", url: searchUrls[idx], data, success: function (res) { var list = res.data || []; var str = ""; if (list.length) { $.each(list, function (index, item) { str += ` <li class="select-item" data-id=${item.id} data-name=${item.name}> ${item.name} </li>`; }); $("#" + val + "-dropdown").html(str); } else { $("#" + val + "-dropdown").html( '<div class="empty-search">无匹配数据</div>' ); } }, error: function (error) { console.log(error); }, }); } // 防抖函数 function debounce(fn, delay = 500) { var timer = null; return function () { var context = this; var args = arguments; timer && clearTimeout(timer); timer = setTimeout(() => { fn.apply(context, args); }, delay); }; } var debounceCategory = debounce(remoteSearch.bind(null, "category", 0), 500); // 绑定input事件 $("#category").on("input", debounceCategory); // 失焦暗藏下拉列表 function hideDropdown(str) { setTimeout(() => { var id = $("#select-" + str + "-id").val(); if (!id) $("#" + str + "").val(""); $("#" + str + "-dropdown").hide(); }, 200); } // 失焦 $("#category").blur(hideDropdown.bind(null, "category")); // 抉择下拉列表某一项 function selectItem(that, str) { var id = $(that).attr("data-id"); var name = $(that).attr("data-name"); $("#" + str + "").val(name); $("#select-" + str + "-id").val(id); $("#" + str + "-dropdown").hide(); } // 抉择 $("#category-dropdown").on("click", ".select-item", function () { selectItem($(this), "category"); });
JQuery切换弹窗状态
function toggleModal(str, bool) { var modal = modalInfo[str]; bool ? $(modal).stop().fadeIn(300) : $(modal).stop().fadeOut(300);}
JQuery导入文件
// 点击导入function selectFile() { $("#import-product-file").click();}// 导入文件$("#import-product-file").change(function () { var fileItem = $(this)[0].files[0]; var fileName = fileItem.name; $("#import-file-name").html(fileName);});// 确认导入function submitImport() { var fileItem = $("#import-product-file")[0].files[0]; if (!fileItem) return alert("请先抉择文件！"); var formData = new FormData(); formData.append("file", fileItem); $("#import-product-file").val(""); $.ajax({ type: "POST", url: "/import", data: formData, contentType: false, processData: false, dataType: "json", success: function (res) { if (res.code === 0 && res.status) { alert("导入胜利！"); getList(); } else { alert(res.msg || "导入失败！"); } }, error: function (error) { console.log(error); }, });}
JQuery实现监听input字数
// 监听键盘输入事件(实时字数)$("#category-desc").on("input", function () { var currentCount = $(this).val().length; $("#category-current-count").html(currentCount);});