JavaScript,js学习教程,,javascript问题集合

JavaScript点击按钮或F11键盘实现全屏以及判断是否是全屏

2023-08-03

有时候我们做一些网页活动，需要用到全屏，我们可以使用JavaScript点击按钮或F11键盘实现全屏以及判断是否是全屏1、点击按钮实现全屏<script> // 全屏显示 $(".translate").click(function(){ ;document.documentElement.requestFullscreen() ;$('.contron').hide(); }) </script> 2、判断是否是全屏，用于执行后续操作<script> /** ;* @description: 检测有没有元素处于全屏状态 ;* @return false: 当前没有元素在全屏状态 ;* @return true: 有元素在全屏状态 ;*/ function isEleFullScreen() { ;const fullScreenEle

如何使用JavaScript获取扫码枪扫码数据，执行相应的操作

2023-08-03

645 0

扫码枪在日常生活中，经常可以看到，比较多的就是超市，网页中我们需要用获取扫码枪的值，就需要用到JavaScript来获取，后再执行操作。JavaScript获取扫码枪数据，扫码枪相当于键盘输入设备，输入一连串数字后加一个enter键。以下教大家怎么获取扫码枪的值：1、放置文本框：首先放置文本输入框，用于接收扫码枪赋值（如果不想显示输入框，可以使用样式将其隐藏即可）<input type="text" class="codevalue" > 2、聚焦文本框：设置定时聚焦文本框，每隔半秒执行一次聚焦，防止文本框失去焦点setInterval(function() { ;$('.codevalue'

JavaScript如何获取URL参数

2022-04-19

995 0

前端有时需要获取url中参数，我们可以使用下面的方法来获取//获取url中的参数 function getUrlParam(name) { ;var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); ; ;var r = window.location.search.substr(1).match(reg); ; ;if (r != null) return decodeURI(r[2]); return null; } 使用方法：比如我们有个参数为p，则可以使用下面方法获取var p = getUrlParam('p');

js如何防止ajax重复提交表单

2022-03-08

1163 0

很多开发者在做表单提交数据到后台的时候，会出现多提交一次，多一条数据的情况，这种原因的是因为服务端未能及时响应结果(网络延迟，并发排队等因素)，导致前端页面没有及时刷新，用户有机会多次提交表单如果提交对象为按钮的话，可以对按钮设置disabled，此办法适应于按钮提交，此种方法简单粗暴，也是很多人用的办法：$(".sub").attr('disabled',true)//在按钮提交之后和AJAX提交之前将按钮设置为禁用 $.ajax({ url:'/post.php' data:{a:1,b,1} success:function(){ $(".sub").attr('disabled',false)//在提交成功之后重新启用该

JS实现多个数据相加

2022-01-15

1801 0

有时我们进行多个数据相加，组合成一个数组，我们可以使用下面方法来实现let arr1 = [1,2,3,4,5,6]; let arr2 = [11,12,13,14,15,16]; let arr3 = [10,21,31,41,51,61]; let json = {arr1,arr2,arr3}; //json中有任意多个数组 //let json = [arr1,arr2,arr3]; //也可以使用数组形式，自行替换测试看结果 //保存结果的数组 let result = [];;; //遍历json for(let key in json){ //遍历数组的每一项 json[key].forEach((value,index) => { if( isBlank(result[index]) ){ result[index] = 0 ; } result[index] += value ;

js如何获取数组中的项

2021-11-15

1402 0

PHP中封装了array_column()函数用去获取取出数组的中项，js需要使用到.map(function(row){})函数获取，以下是函数，供大家参考//获取数据项 function getColumn(anArray,columnNumber) { return anArray.map(function(row) { return row[columnNumber]; }) },

js判断网站URL是不是首页或者是404页面

2021-04-15

2907 0

我们网站有时需要做统一跳转，比如除了首页不跳转外，其他都跳转至某个链接。这样最简单的方法就是判断URL了，通过获取URL来判断。判断是否是首页<script> var;localUrl;=;window.location.href;;; var;regex;=;new;RegExp("^https?://(test-)?www\.tpxhm.com(/?|/index[(.|_)].*|/?[?].*)$",;"i"); if(regex.test(localUrl)==true){ //是首页，;执行相应操作 } </script>该结果会返回true和false，为true时即为首页页面判断是否是404页面<script> var;localUrl;=;window.location.href;;;

前端三大主流框架分别有哪些、优劣势

2021-04-11

2171 0

前端三大主流框架分别有哪些？Angular.js：出来较早的前端框架，学习曲线比较陡， NG1学起来比较麻烦， NG2~NG5开始，进行了一系列的改革，也提供了组件化开发的概念；从NG2开始，也支持使用TS(TypeScript) 进行编程；Vue.js：最火的一门前端框架，它是中国人开发的，对我我们来说，文档要友好一些；Reacts：最流行的一门框架，因为它的设计很优秀；开发团队方面React是由FaceBook前端官方团队进行维护和更新的；因此， React的维护开发团队，技术实力比较雄厚；Vue：第一版，主要是有作者尤雨溪专门进行维护的，当Vue更新到

js判断用户请求是http还是https

2021-03-17

1832 0

有时我们需要判断用户请求是http还是https，来做一些操作。这时可以使用下面的方法来判断<script> //protocol;属性是一个可读可写的字符串，可设置或返回当前;URL;的协议,所有主要浏览器都支持;protocol;属性 var;ishttps;=;'https:';==;document.location.protocol;?;true:;false; if(ishttps){ ;;;console.log('http') }else{ ;;;;console.log('http') } </script>

js获取input监听文本框值，判断非空示例

2021-01-24

1705 0

键盘输入实时显示搜索结果数据，需要用到input监听文本框输入的值，然后请求后端数据，以下个简单的方法，共大家参考。<!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> ;;;;;;;;;.pop{;display:;none;} </style> ;;;;;;;;;<input;type="text";name

js正则获取字符串中url链接地址方法

2021-01-20

2855 0

在开发过程中需要匹配字符串中的手机号，可以使用以下方法来实现提取字符串中的手机号。//;正则匹配匹配url function;httpString(s);{ ;;;;var;reg;=;/(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g; ;;;;var;reg=;/(https?|http|ftp|file):\/\/[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]/g; ;;;;s;=;s.match(reg); ;;;;//;console.log(s[0]) ;;;;return(s[0]) }

javascript实现显示活动倒计时时间

2020-11-30

1485 0

效果预览：https://www.tpxhm.com/mdetail/4.html活动倒计时，我们在很多APP中或者购物网站经常可以看到，比如京东、淘宝、拼多多等。以下是一个简单的实现动态倒计时功能，只需传入当前时间即可。代码实现<!DOCTYPE;html> <html> <head> ;;;;<meta;charset="UTF-8"> ;;;;<title>Title</title> ;;;;<script> window.onload=function;overtime(){ ;;;;var;j=setTimeout(overtime,1000); ;;;;//创建时间 ;;;;var;date=new;Date(); ;;;;//获取年月日小时分钟秒 ;;;;//设置结

网页实现未加载完毕显示loading效果

2020-10-19

2044 0

当网页页面加载文件、或者图片过多是，要等很久才打开，解决方法是增加服务器配置，但是没条件的话，可以考虑通过js判断页面是否加载完毕，加载完毕后在显示内容，没加载完毕显示加载中，这种在H5邀请函中经常看见。以下是实现方法，供大家参考。loading.js判断页面是否在家完毕，未加载完毕显示loading效果var;_PageHeight;=;document.documentElement.clientHeight, ;; _PageWidth;=;document.documentElement.clientWidth; //计算loading框距离顶部和左部的距离（loading框的宽度为215px，高度为61px） var;_LoadingTop;=;_PageHei

JavaScript实现console控制台显示彩色文字，版权信息方法

2020-08-26

2129 0

介绍这个方法之前我们来看下百度的控制台，打开百度网页https://www.baidu.com 按下F12,选择console控制台，可以看到很有趣的百度招聘信息。再来看下大家耳熟的B站https://www.bilibili.com/其次打开博主的网站控制台：可以看到网站名称，qq等信息。看到这里是不是很有趣，我们来看看如何弄这种效果。主要用到这句代码：window.console;&&;(console.groupCollapsed("%c简忆博客",;"color:#FF6666;;font-size:;20px;;font-weight:;300"),console.groupEnd())console.groupCollapsed()方法表示折叠信息组的开始

js 点击当前点击元素增加样式

2019-10-11

3327 0

在按钮点击中，只想对当前点击的元素增加样式，其他元素样式取消。js写法为：;$(".rebpacket;ul;li").click(function(){ ;;;;var;index;=;$(this).index(); ;;;;$(this).addClass("on").siblings().removeClass("on"); });

js 跳转至指定邮箱登录页

2019-09-27

2613 0

;;;;<script> ;;;;;;;;//跳转到指定的邮箱登录页面 ;;;;;;;;$(".nowloginenami").click(function;();{ ;;;;;;;;;;;;var;uurl;=;"554344442@qq.com" ;;;;;;;;;;;;uurl;=;gotoEmail(uurl); ;;;;;;;;;;;;if;(uurl;!=;"");{ ;;;;;;;;;;;;;;;;window.location.href="http://"+uurl ;;;;;;;;;;;;};else;{ ;;;;;;;;;;;;;;;;alert("抱歉!未找到对应的邮箱登录地址，请自己登录邮箱查看邮件！"); ;;;;;;;;;;;;} ;;;;;;;;}); ;;;;;;;;//功能：根据用户输入的Email跳转到相应的

封装GetQueryString()方法来获取URL的值

2019-09-26

2032 0

代码如下：(说明：获取的是当前页面的URL；这里测试需要在后边自己手动添加 ?name=xiangruding&sex=nuuu&age=90)；;<script;type="text/javascript"> ;;;;;;;;;;;;var;name;=;GetQueryString("name"); ;;;;;;;;;;;;var;sex;=;GetQueryString("sex"); ;;;;;;;;;;;;var;age;=;GetQueryString("age"); ;;;;;;;;;;;;console.log("name=;"+name); ;;;;;;;;;;;;console.log("sex=;"+sex);;;;;;;;;;;;; ;;;;;;;;;;;;console.log("sex=;"+age);;;;;;;

JavaScript异步加载，document.write页面空白问题如何解决？

2019-04-17

3650 0

1、Dom元素加载是在文档流中执行的。当最后一行加载出来后。文档流就关闭了。document.close().2、文档流关闭后，如果再去执行document.write()。因为document没有文档流了无法write.所以就会重新document.open()一个新的文档流。导致之前的页面内容被清空。由此可知。在页面加载完毕后再次使用document.write()会导致页面空白。怎么办呢？以下提供解决方法：var;head;=;document.getElementsByTagName('head')[0]; var;script;=;document.createElement('script'); script.src;=;'feature.js'; head.appendCh

JS 循环遍历JSON数据

2019-04-13

3011 1

JSON数据如：{"options":"[{/"text/":/"张三/",/"value/":/"9/"},{/"text/":/"李四/",/"value/":/"10/"},{/"text/":/"王五/",/"value/":/"13/"}]"}用js可以写成：var;data=[{name:"a",age:12},{name:"b",age:11},{name:"c",age:13},{name:"d",age:14}];;; ;;;;;;for(var;o;in;data){;; ;;;;;;;;console.log("text:"+data[o].name+&q

js 短信60秒倒计时

2019-03-21

3383 0

Javascript 实现点击按钮倒计时60秒方可再次点击发送的效果<!DOCTYPE;html> <html> <head> ;;;;<meta;charset="UTF-8"> ;;;;<title>Document</title> </head> <body> ;;;;<a;href="javascript:void(0);";id="gSMS";onclick="get_sms_captcha('2')">获取短信验证码</a>; </body> </html>Javascript代码：var;countDownT;=;60; function;get_sms_captcha(type){ ;;;;countDownT;=;60; ;;;;setTime