Jquery
Byte_Dance
长风破浪会有时,直挂云帆济沧海
展开
-
jquery数组去重
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://code.jquery.com/翻译 2019-03-10 11:01:52 · 1866 阅读 · 0 评论 -
京东首页滚动楼层标识
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, in原创 2018-10-27 22:06:03 · 388 阅读 · 0 评论 -
滚动加载动画
自封装插件 : <script> /*** * 使用方法: * 调用方法时,后边的效果会覆盖前面的,所以只需要调用一次即可 * 此方法全局只执行一次,只有定义了animated类名的才能使用此方法 * <div class="animated bt"></div> /可以使用 * ...转载 2018-09-29 18:54:47 · 932 阅读 · 0 评论 -
短信接口测试
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>请求</title> <script src="http://libs.baidu.com/jquery/2.1.原创 2018-09-29 13:55:57 · 5042 阅读 · 0 评论 -
获取后台数据使用JQ-AJAX 和 Vue-Axios 两种方式的使用对比
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial原创 2018-10-05 18:31:28 · 716 阅读 · 1 评论 -
使用LayUI分页器配合PHP+Mysql创建内容分页
html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href=&quo原创 2018-09-04 17:30:32 · 3184 阅读 · 1 评论 -
使用Jquery配合CSS3动画和2D变换属性制作动态特效
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial原创 2018-08-21 23:48:09 · 376 阅读 · 0 评论 -
页面和页面之间传输数据
在页面和页面之间传输数据的时候1:可以使用cookie 和 session ;2:可以使用from表单传输地址的时候 给form 表单的href里边的index.php 后边添加一个 ? 加上想要发送的数据.传输方法可以使用 POST方法,但是在传数据过去的时候, id值是直接跟在地址栏上的,所以是明文传输,但是from表单里边的内容还是POST密文传输 a标签发送...转载 2018-07-17 22:03:46 · 1422 阅读 · 0 评论 -
jquery ajax 中不能给变量赋值的原因及解决办法
我们在用JQuery的Ajax从后台提取数据后想把它赋值给全局变量,但是却怎么都赋不进,为什么呢?原因其实很简单,我们用的Ajax是异步操作,也就是说在你赋值的时候数据还没提取出来,你当然赋不进去,所以只要改成同步操作就行~方法1:先设置同步在进行Ajax操作?//在全局或某个需要的函数内设置Ajax异步为false,也就是同步$.ajaxSetup({ async ...转载 2018-07-17 21:38:58 · 1025 阅读 · 0 评论 -
发微博页面
HTML页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>微博</title> <script src="http://libs.baidu.com/jquer翻译 2018-07-03 18:34:36 · 663 阅读 · 0 评论 -
电商网站放大镜效果
电商网站放大镜效果<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head...翻译 2018-11-10 12:00:30 · 256 阅读 · 0 评论 -
网易云首页菜单栏
实例:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="http://code.jquery原创 2018-11-28 11:14:01 · 697 阅读 · 0 评论 -
利用 html2canvas 将制定区域输出为图片 并用PHP接收
前端发送页面:需要引入两个包 jquery.js 和 html2canvas.js html2canvas下载传送门:http://html2canvas.hertzen.com/<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <met翻译 2019-02-21 19:24:31 · 866 阅读 · 0 评论 -
input File 选择图片后 预览
<form action="upload.php" method="post" enctype="multipart/form-data"> <div> <img src="" class="img"> </div> <input type=转载 2019-02-08 21:38:52 · 1236 阅读 · 0 评论 -
ajax + PHP 实现 JSONP 跨域请求
ajax$.ajax({ type: "get", data:{random:123}, url: "http://www.98china.cn/kuayu.php", dataType: "jsonp", jsonp: "callback", success: function(data) {...翻译 2019-02-15 15:09:28 · 310 阅读 · 0 评论 -
jquery可拖拽进度条
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, in原创 2019-01-01 23:25:03 · 1154 阅读 · 0 评论 -
插件封装:无限循环滚动
这个方法需要注意的是 : img元素必须要在CSS内先指定宽度,不然等JS去设置宽度的时候,由于图片本身加载进来的时候是图片原来的尺寸,当加载过程中鼠标一旦滑动了一下,就会触发hover离开的函数,这时候再鼠标滑动进去,相当于执行了两次hover离开,就会出现滚动停不下来的情况.为防止 定时器累加 这种情况出现,也可以给定时器上做好预防(即开启定时器之前 都要先关闭定时器):&l...原创 2018-12-31 22:49:09 · 380 阅读 · 0 评论 -
table选项卡原理
table选项卡原理$(this).addClass("active").siblings().removeClass("active");原创 2019-01-04 17:29:23 · 331 阅读 · 0 评论 -
电商放大镜效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> * { ma原创 2019-01-04 00:25:12 · 473 阅读 · 0 评论 -
使用Jquery中的on()来进行事件委托配合JS闭包实现效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial原创 2018-12-26 22:51:38 · 263 阅读 · 0 评论 -
AJAX和XML交互
前端页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="http://apps.bdimg.com/libs/翻译 2018-06-19 22:26:26 · 388 阅读 · 1 评论 -
jQuery滚动条插件
1:资源下载 https://github.com/malihu/malihu-custom-scrollbar-plugin,我是从这里下载的。2:引入 注意顺序。<link rel="stylesheet" href="jquery.mCustomScrollbar.css"><script src="malihu-custom-scrollbar-plugin-mas...翻译 2018-05-30 14:15:12 · 586 阅读 · 0 评论 -
JS点击后变换样式 , 元素的作用域案例 , 借助元素本身的属性,
//这里要把获取的数据存储放置到点击事件的外部作为全局变量,不然数据是会跟随这个元素的内容而改变的,自变量和存储的数据都要放置在函数外部,这里要注意的是变量的作用域j=0; //自变量v = $(" #h2").text(); //获取到的原标题$("#按钮").click(function(){ if(j%2 == 0){ $(" #headline h2...原创 2018-03-05 16:34:17 · 250 阅读 · 0 评论 -
toggle() 事件隐藏和多种状态
如果某个元素调用了 toggle(), 那么就表示要把这个元素隐藏或者显示出来,括号里可以添加毫秒数,来规定具体显示或隐藏需要的时间;如果括号内是两个或多个函数toggle( fn1 , fn2...); 那么每点击一次,就会在这些函数中切换...翻译 2018-02-21 13:16:58 · 1556 阅读 · 0 评论 -
(转)JavaScript及jQuery中的各种宽高属性图解
原文链接 http://blog.poetries.top/2016/12/13/js-props 声明:本文根据慕课网学习视频整理强烈建议打开控制台自己动手练习一遍,这样印象才会深刻第一部分 JavaScript中的宽高属性一、与window相关的宽高属性1.1 window.location和document.locationwindow对象的location属性引用的是location对象,...转载 2018-02-19 22:39:15 · 279 阅读 · 0 评论 -
Jquery文档处理一览
1.内部插入 append(content | fn) 向每个匹配的元素内部追加内容。 $("A").append("B"); 把B内容追加到A元素内容 最后 B-->A appendTo(content) 把所有匹配的元素追加到另一个指定的元素元素集合...翻译 2018-02-18 19:59:32 · 496 阅读 · 2 评论 -
hover和mouseover与mouseente以及mouseout和mouseleave的区别
hover : 悬停可以指定两个函数功能1和功能2,鼠标移入触发功能1,移除触发函数2;mouseover :不论鼠标指针穿过被选元素或其子元素,都会触发mouseover事件。mouseenter :只有在鼠标指针穿过被选元素时,才会触发mouseenter事件。 这样的话,的mouseenter子元素不会反复触发事件,否则在IE中经常有闪烁情况发生。mouseout : 不论鼠标...翻译 2018-02-12 18:44:44 · 667 阅读 · 0 评论 -
Jquery属性一览
Jquery属性 1.属性 attr(name) 获取属性名字的值 如 attr("src"), 在JS脚本中,使用this.src往往会返回一大堆的网页前缀 而使用attr("src")就很纯净,本身的地址是什么就返回什么. ...翻译 2018-02-16 22:18:21 · 243 阅读 · 0 评论 -
Jquery筛选一览
首先我们要搞清楚,筛选和选择器的区别 :选择器是直接返回选中的对象,比如$("hid") ,这么做是使用id选择器直接返回一个对象而筛选则是从已经找到的对象中进一步做一些选取操作,简单来说就是选择器操作的是HTML标签, 而筛选操作的是已经选取了的Jquery对象 , first()是从集合中返回需要的对象,不更改原来的集合,你可以对集合进行更过的过滤操作,而选择器你只能重新另外选对象了筛选 1....翻译 2018-02-16 21:33:06 · 395 阅读 · 0 评论 -
Jquery选择器一览
Jquery选择器 1:基础选择器 #id id名选择器 $("#hid") ele 元素选择器,例如选择所有的h1元素 $("h1") .class class 属性选择器,选择所有的class名一样的元素 $(".classname") * 所有元素选择器 $("*") sel1 , sel...原创 2018-02-16 20:43:46 · 177 阅读 · 0 评论 -
parent()父级 , prev()同辈 , children()子级 关系查找演示
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>关系查找演示</title> <!--百度在线压缩地址--> <script src=&q原创 2018-02-16 20:28:57 · 3658 阅读 · 0 评论 -
表单中的button标签会自动提交表单问题
在form表单内插入一个button按钮,按钮点击后会自动提交表单,本来是想用Jquery给button添加一个事件用来设置多选框的全选 全不选和反选的问题的,但是发现定义在form标签区域内的button点击之后没有反应,闪一下就过去了.于是给form表单的action属性赋了一个值,发现点击button按钮后表单提交了.于是将button按钮定义在form表单外部,以防止表单自动提交,还可以不...原创 2018-02-15 19:41:27 · 730 阅读 · 0 评论 -
使用JS实现一个匀速回到顶部的效果
使用Jquery的回到顶部方法:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <!--百度在线压缩地址--> &l原创 2017-12-23 16:46:18 · 805 阅读 · 0 评论 -
Jquery效果一览
效果 1.基本效果 show() 显示隐藏的匹配元素。 show(speed, [callback]) 可以根据指定的速度动态地改变每个匹配元素的高度、宽度和不透明度。 (其中slow :600ms normal : 400ms fast : 200ms 都需要写在"" 里边...翻译 2018-03-01 16:55:46 · 231 阅读 · 0 评论 -
[插件封装]事件委派实现留言板案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>事件委派实现留言板案例</title> <!--百度在线压缩地址--> <script s翻译 2018-02-24 23:07:40 · 228 阅读 · 0 评论 -
[封装插件]使用Jquery实现点击就更换指定内容
先使用给标签添加属性的方法,然后再获取属性改变内容,比如给H1标签添加一个名称属性,然后再通过点击获取这个属性并赋值给里边的内容。弊端:标签属性一旦添加的过多,标签就会变得很臃肿,不利于将来查看代码<!DOCTYPE HTML > <HTML LANG = “EN” > <HEAD> <元的charset = “UTF-8” > ...原创 2018-02-12 22:03:47 · 468 阅读 · 0 评论 -
[封装插件]Jquery制作完整表单验证示例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Jquery表单验证</title> <!--百度在线压缩地址--> <script sr翻译 2018-02-14 22:26:47 · 744 阅读 · 0 评论 -
[封装插件]Jquery中的CSS处理一览以及回到顶部按钮和鼠标悬停获取坐标的案例
8:CSS处理 CSS样式 css(name) 访问第一个匹配元素的样式属性。$("p").css("color"); css(properties) 把一个“名/值对”对象设置为所有匹配元素的样式属性。 ...原创 2018-02-20 18:47:18 · 242 阅读 · 0 评论 -
[封装插件]酒仙网和京东左侧动态菜单栏案例
酒仙网老式动态菜单栏:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>老式左侧导航栏</title> <!--百度在线压缩地址--> <s翻译 2018-02-21 12:34:33 · 335 阅读 · 0 评论 -
[封装插件]鼠标拖动元素跟随功能
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>鼠标拖动元素跟随功能</title> <!--百度在线压缩地址--> <script sr翻译 2018-02-24 21:04:49 · 489 阅读 · 0 评论