![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
QSWQSWQSWQSWQSW
.
展开
-
点击按钮切换显示和隐藏,点击空白处隐藏盒子
点击按钮切换显示和隐藏,点击空白处隐藏盒子原创 2022-07-21 10:48:10 · 1365 阅读 · 1 评论 -
ajax获取http状态码
ajax获取http状态码原创 2022-04-13 16:31:31 · 1583 阅读 · 0 评论 -
h5移动端rem适配
h5移动端rem适配原创 2022-04-08 10:32:09 · 175 阅读 · 0 评论 -
每次点击按钮input增加,可继续增加输入不同的值
<input id="content" type="text" /><input type="button" id="btn" value="ok" onclick="show()"><script> function show() { var oText=document.getElementById("content"); var oP =document.createElement("p"); oP原创 2021-08-10 14:40:00 · 523 阅读 · 0 评论 -
swiper缩略图的loop为false时,滑动添加类名
// 详情图片联动var galleryThumbs = new Swiper('.gallery-thumbs', { spaceBetween: 1, slidesPerView: 4, freeMode: true, // loop:true, virtualTranslate: true, watchSlidesVisibility: true, watchSlidesProgress:原创 2021-04-06 17:37:28 · 441 阅读 · 0 评论 -
给循环出来的标签给不同的class名
遍历每一项,3个样式一循环,要是想4种就除4$(document).ready(function(){ $('.classify_box').each(function() { var num = $(this).index(); var rem = num % 3; if (rem == 0) { $(this).addClass('div1'); } else if(rem == 1) {原创 2021-04-06 12:03:09 · 143 阅读 · 0 评论 -
选项卡下的swiper滑动和左右箭头失效
给swiper添加这两句就可以了:observer:true,observeParents:true,如图????原创 2021-04-02 17:50:37 · 588 阅读 · 0 评论 -
将数据追加到数组中然后赋值成对象在追加到新的数组中
好多input框,要以键值对的数组传数据给后台第一步:// 将动态添加的input框的value值都添加到一个数组里去 var numArr = []; // 定义一个空数组 var numArr2 = []; // 定义一个空数组 var txt = $('.inquiry_number'); // 获取所有文本框 var txt2 = $('.inquiry_value'); // 获取所有文本框 for (var i = 0; i < txt.le.原创 2021-03-01 14:10:57 · 908 阅读 · 2 评论 -
json数组转成数组,将里面的数据循环出来
json数组转成数组,将里面的数据循环出来入栈到新的空数组中,然后传给后台。原创 2021-02-25 15:07:02 · 288 阅读 · 0 评论 -
layui弹框回车越来越黑
layer.open({ type: 1, skin: 'layui-layer-rim', //加上边框 title: "修改", area: ['420px', '200px'], //宽高 content: $(".content"), success: function () { $(':focus').blur();//解决弹框越来越黑问题 } });原创 2020-12-24 16:47:09 · 294 阅读 · 2 评论 -
Layui中select下拉框选中触发事件
var form = layui.form, layer = layui.layer; // 监听 $(document).ready(function() { // select下拉框选中触发事件 form.on("select", function(data){ alert(data.value); // 获取选中的值 }); });...原创 2020-12-10 17:30:40 · 3813 阅读 · 0 评论 -
[Intervention] Ignored attempt to cancel a touchmove event with cancelable=false
swiper报了这个错误,大家都说加touch-action 但是我的还是不好使然后**给body加了ontouchstart** 就好使了 感觉也比之前顺畅了这个操作是进行手机端兼容处理的,防止伪类:active失效。原创 2020-11-04 14:27:26 · 548 阅读 · 0 评论 -
bootstrap datetimepicker时间插件 第二次点击不显示的问题
最近在项目中引用了bootstrap-datatimepicker控件,但是发现该控件在日期选择框弹出状态下再次点击input则日期选择框消失但再次点击input日期选择框不再弹出。 解决办法: 在日期控件的show方法中给input加上disabled属性。在hide方法中取消disabled属性。show: function (e) { this.picker.show(); this.height = this.component ? this.component.outerHeight()原创 2020-10-27 11:50:57 · 893 阅读 · 0 评论 -
手风琴菜单
HTML<dl class="list_dl"> <dt class="list_dt"> <p>工程车辆</p> <i class="list_dt_icon"></i> </dt> <dd class="list_dd"> <ul>原创 2020-10-14 13:50:13 · 123 阅读 · 3 评论 -
数组的操作
原创 2020-09-27 10:49:19 · 76 阅读 · 0 评论 -
获取js动态增加的input框尾增到数组
首先是一个增加input的事件$(".numberAdd_icon").click(function () { var tr = ` <p class="exhibition_numberAdd"> <span>询价号码</span> <input type="text" placeholder="用于客户询价" class="inquiry_number"> &原创 2020-09-10 15:03:55 · 655 阅读 · 0 评论 -
textarea剩余可输入字数
<textarea onKeyUp="javascript:checkWord(this);" onMouseDown="javascript:checkWord(this);" name="content" style="overflow-y:scroll"></textarea>还可以输入<span style="font-family: Georgia; font-size: 26px;" id="wordCheck">160</span>个字符 &l原创 2020-09-10 11:04:26 · 247 阅读 · 0 评论 -
滚动事件window.scroll只执行成功一次
$(window).scroll(function() { console.log("滚离顶部" + $(document).scrollTop()); //对window对象进行scroll事件解绑 $(window).unbind("scroll");});原创 2020-08-10 13:47:59 · 1034 阅读 · 0 评论 -
滑动屏幕到元素高度后就固定定位
$(function(){ // 广告AD1 位置 $(".ad1 img").load(function(){ let ad1_height = $(this).height() $(window).scroll(function(){ if($(window).scrollTop() >= ad1_height ){ $(".head").css(原创 2020-08-04 10:39:20 · 291 阅读 · 0 评论 -
带swiper的选项卡联动切换
**HTML<!DOCTYPE html >!<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-原创 2020-07-29 17:28:47 · 1668 阅读 · 0 评论 -
js微信h5页面背景音乐
微信H5页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <scrip原创 2020-05-14 10:09:29 · 880 阅读 · 1 评论 -
h5唤起ios app
点击下载的时候,将ios详情页需要的参数通过url地址拼接传给他。判断是不是ios应用,用ios给你的schema链接或者universal link链接检测一下。是的话,跳ios app的详情页链接。不是的话,我这里跳了一个空白页,空白页里直接跳转ios给的苹果商店链接。...原创 2020-04-07 16:22:00 · 723 阅读 · 0 评论 -
pdfh5.js 基于pdf.js和jQuery,移动端PDF预览插件,可手势缩放,支持懒加载
pdfh5.js 基于pdf.js和jQuery,移动端PDF预览插件,可手势缩放,支持懒加载转载 2020-01-13 15:33:51 · 1663 阅读 · 2 评论 -
使用onclick()事件以及"this"获取当前标签属性值
通过onclick事件来获取到动态数据中的data属性值在onclick事件的括号里写this,在方法函数里写一个值用来传输,这样就可以获取到想要的值了。原创 2020-01-13 14:56:46 · 4490 阅读 · 1 评论 -
使用IntersectionObserver让html滚动到可见区域图片懒加载
<!DOCTYPE HTML><html><head> <meta charset="utf-8"> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="viewport" content="width=device...原创 2019-11-29 15:48:58 · 167 阅读 · 2 评论 -
html滚动到可见区域加载动画
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scal...原创 2019-11-29 14:46:03 · 2299 阅读 · 0 评论 -
移动端 ios H5禁用双指手势缩放和双击缩放
移动端 ios H5禁用双指手势缩放和双击缩放转载 2019-11-28 10:31:17 · 1005 阅读 · 0 评论 -
点击切换图片并且点击图片可放大查看
html:<div class="form-inline chooseBanShi"> <span><i class="i_red">*</i>选择版式:</span> <select name="pid" id="format_Qi" onChange="document.x1.src=options[selec...原创 2019-11-18 17:43:51 · 1005 阅读 · 0 评论 -
解决h5用rem布局的页面刚开始缩放一下的问题
js:window.onload = function () { getRem(750, 100)};window.onresize = function () { getRem(750, 100)};function getRem(pwidth, prem) { var html = document.getElementsByTagName("html")[0]; var o...原创 2019-11-15 17:21:10 · 623 阅读 · 1 评论 -
使用wow.js和animate.css滑动页面加载盒子特效
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="../WOW-master/css/libs/animate.css">...原创 2019-10-31 18:05:31 · 162 阅读 · 0 评论 -
刷新页面切换图片
<!DOCTYPE HTML><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>刷新页面切换图片</title> </head> <body> <sc...原创 2019-10-31 16:22:02 · 1037 阅读 · 0 评论 -
列表点击编辑的时候多选删除
在做收藏和消息列表点击编辑进行全选删除和单选删除时,遇到了一个这样的问题:当点击编辑了之后,后面加载出来的列表条目不会渲染上去多选框,也添加不上被选中的状态,这样就导致无法判断是否被选中。请教了一番后,才知道需要把后加载出来的列表先解绑再绑定checked的状态。全选按钮:<input id="all" type="checkbox" class="dr_select" data="a...原创 2019-10-24 13:47:58 · 434 阅读 · 0 评论 -
js搜索历史记录
效果地址:http://www.seetao.com/m_search.html 手机端html:<body> <div class="search_top"> <img src="__IMG__/search_icon2.png" class="search_fang" /> <input type="...原创 2019-10-21 14:58:50 · 581 阅读 · 0 评论 -
jq修改css文件中带有important的属性
$(".page_header_top").css("cssText","padding-bottom:20px!important");原创 2019-10-15 14:51:32 · 243 阅读 · 0 评论 -
localStorage(本地存储)与sessionStorage(会话存储)的区别与方法
localStorage生命周期是永久,用户除非在浏览器上删除localStorage的信息,否则这些信息将永远存在于浏览器中。存放数据大小为一般为5MB,而且它仅在客户端(即浏览器)中保存,不参与和服务器的通信。sessionStorage仅在当前会话下有效,关闭页面或浏览器后被清除。存放数据大小为一般为5KB, 而且它仅在客户端(即浏览器)中保存,不参与和服务器的通信。两种都有相同的...原创 2018-10-31 20:27:57 · 1849 阅读 · 0 评论 -
移动端flexible解决ipad和ipad Pro不适配
**flexible适配ipad和ipad Pro**<script> /(iPhone|iPad|iPhone OS|Phone|iPod|iOS)/i.test(navigator.userAgent)&&(head=document.getElementsByTagName('head'),viewport=document.createEl...原创 2019-05-24 17:37:58 · 3024 阅读 · 0 评论 -
js点击阅读全文
html<div class="wrap"> <div class="detail_main content_wrap"> {$info['content']|htmlspecialchars_decode} </div> <div class="unfold-field"> <!-- <div class="unfl...原创 2019-07-10 15:16:03 · 2174 阅读 · 0 评论 -
打开门样式的加载动画
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>打开门样式加载动画</title> <script src="js/jquery.min.js"></script> <style type="text/cs...原创 2019-07-10 15:23:37 · 239 阅读 · 2 评论 -
波浪竖线样式的加载动画
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script src="js/jquery.min.js"></script> <style> * { margin:...原创 2019-07-10 15:27:05 · 515 阅读 · 0 评论 -
左滑侧边栏
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script src="js/jquery.min.js"></script> <style type="text/css"> ...原创 2019-07-10 15:37:05 · 173 阅读 · 0 评论