![](https://img-blog.csdnimg.cn/20201014180756780.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JQuery
zuo_zuo_blog
这个作者很懒,什么都没留下…
展开
-
连续点击按钮前端防止重复提交
当触发点击事件后,在此事件没完成之前,不能再触发点击事件,在事件完成后才能再次点击目前想到两种解决方案1.点击后,把按钮或链接的disabled设为true,让它变成不可用状态;请求成功之后在变成可点击状态div按钮<div id="but" onclick="savePay()">提交</div>.disable { pointer-events: none;}function savePay() { // 禁用点击事件 $("#but").addClass("原创 2020-05-18 15:41:25 · 4452 阅读 · 0 评论 -
窗口改变的时候自动刷新浏览器
$(window).resize(function () { window.location.reload(); var wd=document.body.clientWidth; if(wd>768){ console.log(666) }});原创 2019-12-20 10:46:20 · 387 阅读 · 0 评论 -
jquery之on()绑定事件和off()解除绑定事件
从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统一取代以前的bind()、 delegate()、 live()等事件函数。on()函数用于为指定元素的一个或多个事件绑定事件处理函数。off()函数off()函数用于移除元素上绑定的一个或多个事件的事件处理函数。off()函数主要用于解除由on()函数绑定的事件处理函数。要删除通过on()绑定的事件...原创 2019-12-20 10:43:34 · 1909 阅读 · 0 评论 -
项目问题animate
1.mouseover和mouseenter的区别mouseover:当鼠标指针位于元素上方时,会发生 mouseover 事件。 mouseenter:当鼠标指针穿过元素时,会发生 mouseenter 事件。2.type事件问题type 事件属性返回发生的事件的类型,即当前 Event 对象表示的事件的名称。它与注册的事件句柄同名,或者是事件句柄属性删除前缀 “on” 比如 “su...原创 2019-12-17 14:42:05 · 139 阅读 · 0 评论 -
Thymeleaf语法
Thymeleaf是Web和独立环境的现代服务器端Java模板引擎,能够处理HTML,XML,JavaScript,CSS甚至纯文本。Thymeleaf的主要目标是提供一种优雅和高度可维护的创建模板的方式。为了实现这一点,它建立在自然模板的概念上,将其逻辑注入到模板文件中,不会影响模板被用作设计原型。这改善了设计的沟通,弥补了设计和开发团队之间的差距。Thymeleaf也从一开始就设计了Web...原创 2019-11-06 10:53:24 · 515 阅读 · 0 评论 -
Jquery动画知识
1.动画显示$(selector).show(); 不加参数$(selector).show(2000); 参数为执行动画时长$(selector).show(“slow”);jQuery预设值是:slow、normal、fast$(selector).show(2000, function() {});执行完后立即执行的回调函数2.动画隐藏$(selector).hide(100...原创 2019-05-07 19:07:17 · 165 阅读 · 0 评论 -
Jquery菜单缓慢下拉
<html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> * { margin: 0; padding: ...原创 2019-05-07 19:19:15 · 412 阅读 · 0 评论 -
五角星评分案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding:0; margin:...原创 2019-05-15 16:42:05 · 267 阅读 · 0 评论 -
JQ表格全选反选
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding:0; margin:...原创 2019-05-12 19:23:37 · 506 阅读 · 0 评论 -
val()、text() 方法:、html方法
val()方法:作用:设置或返回表单元素的值,例如:input,select,textarea的值//val,获取标签中的value属性alert($(“input”).val());$(“input”).val(“我是”);text() 方法:作用:设置或获取匹配元素的文本内容text,获取双闭合标签中的文本值alert($(“div”).text());//html,获取双闭...原创 2019-05-13 16:25:26 · 293 阅读 · 0 评论 -
动态输入案例-text,val练习
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> * { margin: 0; paddin...原创 2019-05-13 17:03:06 · 170 阅读 · 0 评论 -
ajax测试jq_get方法和jq_post方法和jq_ajax方法
(1)jQuery.get(url,[data],[callback],[type])通过远程 HTTP GET 请求载入信息。这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。(2)参数url:待载入页面的URL地址data:待发送 Key/value 参数。callback:载入成功时回调函数。t...原创 2019-05-30 09:48:25 · 323 阅读 · 0 评论 -
Jquery插件机制
1.为jq添加插件jQuery.extend(object)在这个方法中 我们可以使用 $(‘选择器’)获取的 jq对象this 就是 我们获取到的jq对象用以扩展 jQuery 对象,在jQuery命名空间上增加两个函数。$(“xxx”).fun调用jQuery.extend({min: function(a, b) { return a < b ? a : b; },max...原创 2019-05-30 21:21:31 · 141 阅读 · 0 评论 -
图片京东Table栏
类操作addClass()添加类removeClass()移除类hasClass()是否包含类ttoggleClass()切换类操作类样式的时候,所有的类名,都不带点(.)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>...原创 2019-05-07 17:02:21 · 213 阅读 · 0 评论 -
表格动态创建数据-模太框
CSS部分<style> * { padding: 0; margin: 0; } .wrap { width: 410px; margin: 100px auto 0; } table { ...原创 2019-05-09 15:33:03 · 157 阅读 · 0 评论 -
JQuery简介
1.jquery是一个快速的、小巧的、特点众多的JavaScrit库。2.它用自己非常方便的跨浏览器API,使得诸如文档遍历、文档操作、事件监听、动画、和Ajax变的简单。3.JQuery版本问题:jquery的最新版本是3.1.0,不兼容IE6、7、8jQuery1.12.3兼容IE6、7、8jquery3和jQuery1.12.3的API完全一样。4.引包jquery是JS...原创 2018-11-21 20:26:04 · 155 阅读 · 0 评论 -
jQuery 滑动方法
jQuery 滑动方法可使元素上下滑动。slideDown()slideUp()slideToggle()<!DOCTYPE html><html><head><script src="/jquery/jquery-1.11.1.min.js"></script><script type="text/javascr...原创 2019-04-27 13:15:36 · 1681 阅读 · 0 评论 -
Jquery节点操作
1. 动态创建元素 //创建节点1:$("标签”) console.log($("<li>我是</li>")); //创建节点2 $("ul").html("<li>我是HTMl</li>");2.添加元素在盒子末尾添加 var newli=$("<li>append添加</li>");...原创 2019-05-08 11:30:05 · 202 阅读 · 0 评论 -
Jquery选择水果案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> select{ width:170px; ...原创 2019-05-08 11:31:10 · 1172 阅读 · 0 评论 -
突出显示find+siblings
鼠标放入li中,其他的li半透明,当前盒子,opacity值为1;离开wrap的时候所有的li全部opacity值为1;<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <st...原创 2019-05-05 20:02:34 · 181 阅读 · 0 评论 -
JS隔行变色this
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="js/jquery-1.11.1.js"></script> <scri...原创 2019-05-05 19:27:18 · 115 阅读 · 0 评论 -
手风琴案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding: 0; margin...原创 2019-05-05 20:21:35 · 219 阅读 · 0 评论 -
下拉菜单案例(children+this)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> * { margin: 0; ...原创 2019-05-05 19:07:52 · 937 阅读 · 0 评论 -
淘宝服饰广告案例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> *{ padding:0; margin:...原创 2019-05-05 21:11:53 · 187 阅读 · 0 评论 -
jq事件绑定四种方式
1. 简单事件绑定:这种绑定事件方式不会重叠$(document).click(function () {alert(1);})2. bind方式(不推荐,1.7以后的jQuery版本被on取代) $(document).bind("click mouseenter",function () { alert(1); })比简单事件绑定方式...原创 2019-05-13 18:00:49 · 14955 阅读 · 0 评论 -
回车换行
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="js/jquery-1.11.1.js"></script> <scri...原创 2019-05-13 18:41:15 · 316 阅读 · 0 评论 -
按键换色
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> .wrap{ width:400px; h...原创 2019-05-14 09:27:32 · 146 阅读 · 0 评论 -
jQuery 3.3.1下载地址
Download the compressed, production jQuery 3.3.1-----压缩版本,生产环境用的Download the uncompressed, development jQuery 3.3.1----未压缩版的,研发的时候用的原创 2018-11-21 20:24:17 · 6073 阅读 · 1 评论