jQuery,jQuery系列使用问题

jquery.qrcode.js生成二维码并转成图片格式

2022-08-30

1、引入插件<script;src="../Js/jquery-1.11.3.min.js"></script>;; <script src="https://cdn.bootcdn.net/ajax/libs/qrcodejs/1.0.0/qrcode.js"></script> 2、部分代码;<div id="divOne"></div>;; ;<img id='imgOne';style='border:1px solid red;'/>;; 3、Canvas生成代码<script>;; //默认使用Canvas生成，并显示到图片;; ;var qrcode= $('#divOne').qrcode('http://www.tpxhm.com/').hide();;; ;var canvas=qrcode.find('canvas').get(0);;; ;$('#imgOne').attr('src',canvas.toData

JQ判断重置单选按钮radio为空

2022-06-25

360 0

html单选按钮在表单提交经常会用到，我们提交数据成功的时候，清空表单内容，如果重新加载页面来清空，体验会不怎么好，所以我们采用局部刷新的形式，重置表单内容，以下是重置单选radio的值方法：1、获取radio单选按钮值$('input[name="pro"]:checked').val() 2、清空单选按钮值$('input:radio[name="pro"]').prop('checked',false);

解决jq动态添加class之后无法使用点击事件问题

2021-09-28

794 0

很多开发者、初学者会发现，使用jq给div动态加class之后，再次使用该clas点击事件，会出现无法点击的问题，我们使用下面方法来实现点击，解决该问题。$(document).on('click','.classname',function (){ });

jquery实现导出Excel功能，支持多sheets导出

2021-09-25

767 0

前端项目开发中，我们有时需要将表格数据完整的导出来，而且保留原有样式，这样的如果用后端导出会比较麻烦，我们可以采用jquery来导出。1、比如有入如下几个表格;<button type="button" class="layui-btn" onclick="tablesToExcel('#table_1,#table_2,#table_3,#table_4,#table_5', '客户评分汇总.xls');" >导出</button> <table id="table_1" data-SheetName="表格一" > ;;<thead> ;;;;<tr style="background:#008080; color:#fff; font-weight:bold; height:50px;"> ;;;;;;<th width="60px" style="b

js实现红包雨案例，如何使用js实现红包雨

2020-10-12

1527 0

快到双11了，每到双11购物节，可以看到浏览器有红包雨特效，以下是一个简单实现红包雨特效的方法，供大家参考。效果演示：代码实现说明：附件demo下载：https://github.com/jyblogs/hongbao1、前端html代码<!DOCTYPE;html> <html> <head> <meta;charset="UTF-8"> <title>红包雨</title> <link;rel="stylesheet";href="css/style.css"> <script;src="https://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script> <script;src

html+js实现雪花飘落特效效果的两种方法

2020-10-11

2003 0

我们经常可以看到有些网站有雪花飘落的功能，这是如何做的呢？实际上用到了HTML、js和canvas，以下是个简单的例子供大家参考。第一种效果展示：实现代码1、前端HTML代码：<!DOCTYPE;html> <html> <head> <meta;charset="UTF-8"> <title>Document</title> <script;src="https://libs.baidu.com/jquery/2.1.1/jquery.min.js"></script> </head> <body> ;;;<style> ;;;;;;;;.snow{ ;;;;;;;;;;;;width:;100%; ;;;;;;;;;;;;height:;100vh;

js实现手机号码加空格或者加空格

2020-10-02

1367 0

我们平时看到一些输入手机号的会出现空格或者-号的，这时怎么实现的呢？我们通过以下的方式对其进行格式化，实现3-4-4的形式。1、手机号码加空格符function;Mobile2(obj) { ;;;;;;;;var;value;=;obj; ;;;;;;;;value;=;value.replace(/\s*/g,;""); ;;;;;;;;var;result;=;[]; ;;;;;;;;for(var;i;=;0;;i;<;value.length;;i++) ;;;;;;;;{ ;;;;;;;;;;;;if;(i==3||i==7) ;;;;;;;;;;;;{ ;;;;;;;;;;;;;;;;result.push(";";+;value.charAt(i)); ;;;;;;;;;;;;} ;;;;;;;;;;;;else ;;;;;;;;;;;;{ ;;;;;;;;;;;;;;;

jq获取li列表第几个元素值,jq获取列表元素方法

2020-09-22

1381 0

假设我们有段html代码，让我我们需要获取其中的元素<ul;class="list"> ;;;;<li>列表一</li> ;;;;<li>列表二</li> ;;;;<li>列表三</li> ;;;;<li>列表四</li> ;;;;<li>列表五</li> </ul> <button;type="button";class="btn">按钮</button>jquery获取其中元素方法，需要用到eq()方法，元素从0开始1、点击按钮获取值：$('.btn').click(function(){ ;;;;var;a;=;$('.list;li').eq(0).text(); ;;

js合并两个数组生成合并后的key：value数组方法

2020-04-23

2331 0

js合并两个数组生成合并后的key：value数组方法// var activeSubjectsName = ["JAVA", "PHP", "Android", "IOS", "Python"];// var activeSubjectsNum = [46, 2, 2, 28, 29];// var activeSubjectsArr = [];for (var i = 0; i < activeSubjectsName.length; i++) { console.log(i); var activeSubjectsObject = {}; for (var j = 0; j < activeSubjectsNum.length; j++) { ;if (i == j) { ; activeSubjectsObject.name = activeSubjectsName[i]; ; activeSubjectsObject.value =

前端使用JsBarcode生成条形码

2020-03-21

2312 0

前端使用JsBarcode生成条形码注：需引入 jsbarcode 插件JsBarcode安装:npm;install;jsbarcode;--save npm;install;jsbarcodeHTML 生成条形码代码<!DOCTYPE;html> <html> ;<head>; ;;<meta;charset="utf-8";/>; ;;<meta;name="viewport";content="width=device-width,;initial-scale=1,maximum-scale=1,;user-scalable=no";/>; ;;<title></title>; ;;<script;type="text/javascript";src="js/jquery.min.js"></script>;

JavaScript 获取当前网页header头部信息

2020-03-16

2743 0

JavaScript 获取当前网页header头部信息var;req;=;new;XMLHttpRequest(); req.open('GET',;document.location,;false); req.send(null); var;headers;=;req.getAllResponseHeaders().toLowerCase(); console.log(headers);

JS动态获取图片分辨率宽高大小

2020-03-07

3214 0

JS动态获取图片分辨率宽高大小;<p;class="ddkkkkk_{{$item->id}}"></p> <script> function;getpic(url,obj){ var;img;=;new;Image(); img.src;=;url; if;(img.complete);{ document.write(img.width;+;'x';+;img.height); $('.ddkkkkk_'+obj).text(img.width;+;'x';+;img.height); };else;{ img.onload;=;function;();{ //;document.write(img.width;+;'x';+;img.height); $('.ddkkkkk_'+obj).text(img.width;+;'x';+;img.he

jquery数组去重

2020-01-02

1537 0

sessionStorage的使用

2019-11-03

1854 0

localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。sessionStorage 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。使用案例：html code:<div;class="modecer"> ;;;;<div;;class="colsebtn">关闭</div> </div>javascript code：//判断sessionStorage里有没有isClose if(sessionStorage.getItem("isClose")){;;;;;;;;;;;;; ;;;;;;;;;;;;$(".modecer").hide(); ;;;;;;;;}else{ ;;;;;;;;;;;;$(".mo

radio，CheckBox选中状态，判断是否选中，根据值设置radio选中

2019-10-24

2644 0

radio，CheckBox选中状态，判断是否选中，根据值设置radio选中;<input;name="rbsex";id="man_radio";type="radio";;value="1";checked="checked";/><label>显示</label> ;<input;name="rbsex";id="woman_radio";type="radio";value="0";/>隐藏var;stop;=;data.result $(":radio[name='rbsex'][value='";+;stop;+;"']").prop("checked",;"checked");radio

JS实现Base64加密解密

2019-10-23

2030 0

JavaScript实现Base64加密解密。Base64与其说是加密算法不如说是方便数据传输而生的数据转换手段。测试代码：<!DOCTYPE;html> <html> <head> ;;;;<title>test</title> ;;;;<meta;charset="utf-8"> ;;;;<script;type="text/javascript";src="js/base64.js"></script> ;;;;<style> ;;;;;;;;.resource_enc,;.resource_dec{ ;;;;;;;;;;;;width:;500px; ;;;;;;;;} ;;;;;;;;.p1,;.p2{ ;;;;;;;;;;;;min-height:;100px; ;;;;;;;;;;;;backgrou

jQuery实现购物车物品数量的加减

2019-10-09

1805 0

实现购物车物品数量的加减，最小值为1，当最小值为1时再按减少，减少按钮不可编辑，当按增加数量时恢复减少按钮状态。这个除了加减功能外，也可以自动计算价格。<!DOCTYPE;html;PUBLIC;"-//W3C//DTD;XHTML;1.0;Transitional//EN";"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">;;;; <head>;;;; <meta;http-equiv="Content-Type";content="text/html;;charset=utf-8";/>;;;; <title>jQuery实现购物车物品数量的加减</title>;;;; <script;type

jQuery根据屏幕下拉到一定高度显示返回顶部按钮

2019-09-30

1698 0

jQuery根据屏幕下拉到一定高度显示返回顶部按钮例子：$(function(){ $('.getop').hide(); $(window).scroll(function(){ if($(window).scrollTop()>900){ $('.getop').fadeIn(300); } else{$('.getop').fadeOut(200);} }); $('.getop').click(function(){ $('body,html').animate({scrollTop:0},900); return;false; }) })

jquery 实现类似淘宝换一换功能

2019-08-29

1899 0

类似淘宝换一换功能在工作中我们经常会遇到，以下是一个简单的案例，仅供大家参考。实现效果图：实现代码：<!DOCTYPE;html> <html> <head> <meta;charset="UTF-8"> <title>换一换</title> <script;src="http://code.jquery.com/jquery-1.8.3.min.js"></script> </head> <body> <style> *{margin:0;padding:;0px;} .hsow{width:;400px;;height:;400px;;margin:;0;auto;;background-color:;#fff;} .news-sub{;width:;400px;;height:;266

jquery.cookie.js实现记住手机号功能

2019-06-16

2345 0

记住账号或者密码，在很多网站上都可以看到，以下是一个简单的方法，用到的是 jquery.cookie.js ，供大家参考注意：cookie必须在线上才能起效的哦。附件下载地址：jquery.cookie.txt百度云盘下载地址：链接：https://pan.baidu.com/s/14h5EsL3Z4U3bGSssbByEjA;提取码：9rza;html代码：;;//引入jquery.cookie.js ;;<script;src="jquery.cookie.js"></script> ;;;;<h1;class="title3">电话<span>*</span></h1> ;;;;<div;class="inp4"> ;;;;;;;<input;type=

JS判断页面加载是否完成

2019-06-13

1650 0

在做页面的时候,经常碰到要在页面加载完全之后再去展现。JS判断页面加载是否完成;;document.onreadystatechange;=;function(){; 　　;if(document.readyState;==;"complete"){ ;;;;;;;;;;window.location="https://www.tpxhm.com/" ;;;　;} ;;}