随笔分类 - 事件
摘要：<div class="none-box2-btn"> <div id="boxBtn1" class="none-box2-btn-son btnlight" onclick = "document.getElementById('boxBtn2').classList.remove('btnli
阅读全文
摘要：解决思路：延时一点时间再去获取内容的高度 const oBox=document.getElementById("headbox"); setTimeout(function(){ console.log(oBox.scrollHeight) },100) 实战代码： <script> const
阅读全文
摘要：1 <div class="showTime"></div> 2 <script> 3 var t = null; 4 t = setTimeout(time, 1000); //開始运行 5 function time() { 6 clearTimeout(t); //清除定时器 7 dt = n
阅读全文
摘要：刚做完一个响应式不同设备的前端页面，今天分享一下前端开发的常用技巧。 1、阻止input显示历史记录 不让浏览器保留表单输入的历史记录，只要在input标签里加入autocomplete="off "这个属性就可以啦。 2、 利用 CSS 穿透覆盖默认样式 常见发生场景：假如我们需要通过 input
阅读全文
摘要：一、换行，回车 换行回车在不同操作系统下的含义 以下均为单击 Enter 键产生 Windows：系统行末结束符是 ‘\r\n’ Linux：统行末结束符是 ‘\n’ Mac：系统行末结束符是 ‘\r’ js 字符串中的字符替换 将字符串中的换行符替换成在HTML中正确显示换行的的 <br/> 换行
阅读全文
摘要：1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.
阅读全文
摘要：1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <title>精美js日期选择器，js省市选择器- 何问起 </title> 4 <link type="text/css" rel="Stylesheet" href="http://
阅读全文
摘要：1、next(); // 获取当前元素的下一个兄弟元素 2、nextAll(); // 获取当前元素后面所有的兄弟元素 3、prev(); // 获取当前元素的前一个兄弟元素 4、prevAll(); // 获取当前元素前面的所有兄弟元素 5、siblings(); // 获取当前元素的所有兄弟元素
阅读全文
摘要：<div class="apply_box_three"> <div>提交</div> <div class="apply_box_three_right">重置</div> </div> <script> $(".apply_box_three_right").off().on('click',f
阅读全文
摘要：var url = location.search; if(url.indexOf("?")!= -1){ var str = url.substr(1); strs = str.split("="); } console.log(strs[1]); 参考链接：https://wenku.baidu
阅读全文
摘要：效果：有8个一级导航（第一张图片），点击进入后，有二级导航以及页面内容（第二三张图片）。 html结构（代码在后面）： 1 <!-- 主要内容（移动端） --> 2 <div class="col-xs col-sm hidden-md hidden-lg centerbox"> 3 <!-- 包含
阅读全文
摘要：效果： 左侧导航结构代码：绑定id名为pcnav 右侧结构代码：绑定id名为pcson jq代码： 1 // PC端的nav切换 2 $("#pcnav>li:eq(0)").addClass('centerbox_in_disc'); // 第一个nav标红 3 $("#pcson>div").h
阅读全文
摘要：结构：绑定id jq代码： 1 // PC端的nav切换 2 $("#pcnav>li:eq(0)").addClass('centerbox_in_disc'); // 第一个nav标红 3 $("#pcson>div").hide(); 4 $("#pcson>div:eq(0)").show(
阅读全文
摘要：效果： 结构： JS代码： $(document).ready(function() { // 下拉菜单的显隐 $(".nav_son").hide(); $(".nav_son_box").hide(); $(".headbox_second_nav>div").hover(function(){
阅读全文
摘要：直接在body写就行了<body ondragstart="return false">
阅读全文
摘要：效果： HTML： <div class="copybox"> <div class="copybox_left">UNZYXK</div> <div class="copybox_right">复制</div> </div> JS： <!-- 复制按钮 --> <script> $(".copyb
阅读全文
摘要：我的效果： HTML： JS： <!-- 分页 --> <script> /** * 分页函数 * pno--页数 * psize--每页显示记录数 * 分页部分是从真实数据行开始，因而存在加减某个常数，以确定真正的记录数 * 纯js分页实质是数据行全部加载，通过是否显示属性完成分页功能 **/ f
阅读全文
摘要：html： <input id="pwd1" type="password" placeholder="设置登录密码" class="in_input"> <input id="pwd2" type="password" onkeyup="validate()" placeholder="重复登录密
阅读全文
摘要：效果： 代码： html： <!-- 验证码2 --> <div class="loginbox_in"> <div class="loginbox_in_icon2"> <img src="images/login2_06.jpg" /> </div> <div class="loginbox_i
阅读全文
