![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
jQ
初来乍到到
一切文章都是为了记录自己
展开
-
JQ--上传图片
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="renderer" content="webkit|ie-comp|ie-stand"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" co.原创 2020-11-13 10:32:18 · 566 阅读 · 0 评论 -
JQ--复制文本
//适合循环出来需要复制的内容 也适合单独的内容<div class="order_number"> <span>订单号:<text id="shop1">11111111</text></span> <input type="button" value="复制" class="qlj" onclick="copyToClip('1111111111')" /> </div> <script&..原创 2020-11-13 10:29:07 · 1256 阅读 · 0 评论 -
JQ--阻止点击事件冒泡
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>阻止点击事件冒泡</title> <style> .father { width: 400px;.原创 2020-11-13 10:14:36 · 1253 阅读 · 0 评论 -
switch——好用的JQ开关按钮
<div class="testswitch"> <input class="testswitch-checkbox" id="onoffswitch" type="checkbox"> <label class="testswitch-label" for="onoffswitch"> <span class="testswitch-inner"></span> <span class="testswitch-swit.原创 2020-10-24 15:33:17 · 1178 阅读 · 0 评论 -
点击文字同时选中checkbox radio按钮 label实现
<div class="divFlex" data-price="0.00" data-value="0"> <p class="p"> <label class="label-input" data-price="0" data-value="0"> <input type="radio" class="radio" name="m_c.原创 2020-07-09 15:47:47 · 487 阅读 · 0 评论 -
html2canvas 把标签合成为canvas图片
<style> #can{ background:red; height:200px; width:200px; text-align: center;line-height:200px;}<style><div id="can"> 合成为图片</div><img class="info_fofo" src="" />//先引入js文件<script src="http:/.原创 2020-05-22 10:45:20 · 446 阅读 · 0 评论 -
jQ -- 整合radio选中样式改变并拥js控制选中
//css样式input[type="radio"]+label::before { content: "\a0"; display: inline-block; vertical-align: middle; width: 12px; height: 12px; margin-right: 5px; border-radius: 50%; text-indent: .15em; border: 1px solid #CCCCCC;.原创 2020-05-22 09:58:33 · 424 阅读 · 0 评论 -
table表格里面的数量竖向相加
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>Docume...原创 2020-04-11 10:31:47 · 499 阅读 · 0 评论 -
JS--文章置顶功能
其实写法很简单Js基础好的很快就知道怎么写了,我之前没过今天写了个demo就顺便记录一下,以便记忆,俗话说:好记性不如烂笔头嘛!<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=de...原创 2020-07-20 17:09:36 · 2496 阅读 · 0 评论 -
如何在浏览器网页中调用QQ聊天
很多时候,我们在网站中需要加入联系QQ的功能,我下面就来说下在web页面中调用QQ聊天是如何实现的,直接上代码:<!DOCTYPE HTML><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-...转载 2019-10-18 16:41:05 · 990 阅读 · 0 评论 -
jQuery选项卡
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv=...原创 2019-08-05 14:53:15 · 90 阅读 · 0 评论 -
前端处理时间戳
话不多说直接上代码:new Date(1448954018000).toLocaleDateString()//1448954018000代表后台给的时间戳var timestamp = "2019-06-11T12:26:16.556Z"var date = new Date(+new Date(timestamp )+8*3600*1000).toISOString().rep...原创 2019-03-28 15:50:05 · 2361 阅读 · 0 评论 -
实现滚动到一定位置时,导航栏置顶的效果
告别js用css实现滚动到一定位置时,导航栏置顶的效果。<div class="nav">这里是导航栏所在的DIV容器。</div>css代码:.nav{ position:fixed; /* 绝对定位,fixed是相对于浏览器窗口定位。 */ top:0; /* 距离窗口顶部距离 */ left:0; /* 距离窗口左边的距离 */...原创 2019-04-16 11:11:31 · 4437 阅读 · 0 评论 -
电商头部导航栏滑动效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>menu</title> <meta name="viewport" content="width=device-width,initial-scale=1...原创 2019-04-19 13:39:46 · 870 阅读 · 0 评论 -
vue拖拽
js 代码 在methos// 模块拖拽事件 move(e) { let Module = e.target; //获取目标元素 let _this = this; //算出鼠标相对元素的位置 let disX = e.clientX - Module.offsetLeft; let disY = e.clientY - Mo...原创 2019-05-09 17:08:46 · 390 阅读 · 0 评论 -
ES6去重和排序
其实代码很简单就是用了es6语法。 var arr=[1,3,3,5,9,4,8,6,7,2,8]; arr = Array.from(new Set(arr)) // 正序 console.log(arr.sort()) // 先正序在翻转就成了倒序了 console.log(arr.sort().reverse())1. ...原创 2019-05-17 14:15:49 · 2829 阅读 · 0 评论 -
JS实现html页面点击下载文件的两种实现方法
1.使用<a>标签来完成<a href="/user/test/xxxx.txt" download="文件名.txt">点击下载</a>这样当用户打开浏览器点击链接的时候就会直接下载文件。但是有个情况,比如txt,png,jpg等这些浏览器支持直接打开的文件是不会执行下载任务的,而是会直接打开文件,这个时候就需要给a标签添加一个属性“downlo...转载 2019-06-19 14:57:06 · 3014 阅读 · 0 评论 -
js之动态的变换css属性和随机生成六位数字验证码
tab.click(function () { $(this).addClass("active"); $(this).siblings().removeClass("active"); });.active{ background: #ccc;}.siblings() 返回被选元素的所有同级元素const code = Math.floor(Math.ra...原创 2019-06-17 16:54:28 · 467 阅读 · 0 评论 -
JavaScript js 实现时间相减得到所需的时差
var date1= '2019-04-26 11:05:32'; //开始时间 var date2 = new Date(); //结束时间 var date3 = date2.getTime() - new Date(date1).getTime(); //时间差的毫秒数 var subMinutes...原创 2019-06-12 13:53:29 · 696 阅读 · 0 评论 -
三目运算符
三目运算符记录贴(一)19/7/18<body> <button class="btn">按钮</button></body><script> var a =1; a>0? $('.btn').hide():$('.btn').show() // if(a > 0){ // $('....原创 2019-07-18 18:10:30 · 185 阅读 · 0 评论