
jquery
学习代表未来
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
jsonp 跨域
JSONP只支持GET请求下面以一个案例来进行说明jsonp的实现假如请求的url:http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998&callback=flightHandlerajax请求代码: jQuery(document).ready(function(){ $.ajax({ type: "get", async: false,翻译 2020-09-27 10:13:45 · 128 阅读 · 0 评论 -
jquery中使用datepicker限制开始日期小于结束日期
//这是开始日期的操作$("#endTime").datepicker({ //此处写自定义的参数操作 如showOtherMonths: true, selectOtherMonths: true, onSelect: function (dateText, inst) { //$("#begTime").datepicker("option ", "maxDate", new Date.转载 2020-06-25 11:46:24 · 1000 阅读 · 0 评论 -
防止按钮重复点击的解决方案与思路
点击此处转载 2020-05-29 15:13:11 · 1044 阅读 · 0 评论 -
jquery 根据自定义属性来获取标签
<p data-id="test">123</p><script> var html=$("p[data-id='test']").html(); console.log(html) //123</script>翻译 2019-02-21 11:36:59 · 4139 阅读 · 2 评论 -
jquery动态计算menu菜单的高度
1.dom元素2.js代码 // 初始化菜单高度 function setsize() { var max_h = $(".menu_wrapper_inner").height(); var window_h = window.innerHeight; var body_h = $("body").height(); ...原创 2020-03-18 20:50:52 · 542 阅读 · 0 评论 -
jquery获取元素的所有宽高(包括内边距和外边距)
width() - 返回元素的宽度。height() - 返回元素的高度。innerWidth() 方法返回元素的宽度(包括内边距)。 innerHeight() 方法返回元素的高度(包括内边距)。 outerWidth() 方法返回元素的宽度(包括内边距和边框)。 outerHeight...原创 2020-03-18 20:41:54 · 1424 阅读 · 0 评论 -
:not()用来匹配不符合一组选择器的元素
例如:选择type不等于submit的所有input元素$("input:not([type='submit'])")原创 2020-03-18 20:40:48 · 321 阅读 · 0 评论 -
jquery 滚动条 scroll 和 animate出现的问题总结
原文链接出现问题:1、每次scroll都使动画反复触发,解决这个问题使用动画的 stop(),这个方法主要是为了停止所有指定元素上运行的动画两个参数,第一个参数删除队列动画,第二参数是让当前正在执行的动画立即完成,并且重设show和hide的原始延时,调用回调函数,示例:$("#div").stop(); 停止当前动画,继续下一个动画$("#div").stop(tru...转载 2020-01-08 15:59:27 · 1442 阅读 · 0 评论 -
jquery 通过animate实现height: auto展开收缩动画
实现原理:当点击展开时,获取元素height: auto的高度为多少像素,由当前高度到height:auto的过渡;反之。var m_flag = true;var el = $(".case-detail-con"), curHeight = el.height();$("#casesdetail_more").click(function(){ if(m_flag){ ...转载 2020-01-08 15:48:35 · 745 阅读 · 0 评论 -
jquery插件总结
自定义滚定条jquery.nicescroll官网:https://nicescroll.areaaperta.com/全屏滚动插件fullPage.js官网:http://fullpage.81hu.com/数字自增:https://lemehovskiy.github.io/lem-counter/雪花飘落:https://www.17suc...原创 2019-09-16 10:56:13 · 198 阅读 · 0 评论 -
jquery实现checkbox全选与反选
<input type="checkbox" id="All" />全选/反选<br /><div id="div"> <input type="checkbox" class="item" />1<br /> <input type="checkbox" class="item" />2<br /&...原创 2019-09-12 16:14:33 · 501 阅读 · 0 评论 -
js判断对象是否为空对象的几种方法
var obj = {};1.将json对象转化为json字符串,再判断该字符串是否为"{}"var a = (JSON.stringify(obj) == "{}");console.log(a); //true2.for in 循环判断var b = function () { for (var key in obj) { return fal...翻译 2019-09-12 10:03:44 · 298 阅读 · 0 评论 -
jquery中call()和apply的使用方法
参考链接apply:调用一个对象的一个方法,用另一个对象替换当前对象。例如:B.apply(A, arguments);即A对象应用B对象的方法。只接收两个参数,其中第二个参数必须是一个数组或者类数组function add(a, b) { return a + b;}function sub(a, b) { return a - b;}var a1 = ...翻译 2019-07-28 16:24:04 · 1331 阅读 · 0 评论 -
jquery map()的使用方法
1.$.map( object, callback )var arr = ["a", "b", "c", "d", "e"];var newArr = $.map(arr, function (value, index) { return value;})$(".demo1").text(newArr.join(","));2. .map(callback(index,...翻译 2019-07-28 15:58:07 · 872 阅读 · 0 评论 -
tab栏鼠标移入移出或点击选中,下边线缓慢显示或隐藏
1. css<style>ul{ margin: 0; padding: 0; font-size: 0;}li{ margin: 10px; padding: 10px; font-size: 18px; color: #000; line-height: 30px; display: inline-block; vertical-ali...翻译 2019-07-11 10:50:30 · 560 阅读 · 0 评论 -
jquery实现radio的选中与反选
参考链接:https://blog.youkuaiyun.com/pengpengpeng85/article/details/786565041.dom元素如下<div> <input type="radio" name="" id="" value="" />英国</div>2.js取消 click 事件的默认动作 使用 mouseup 控制 ...转载 2019-03-25 13:49:49 · 1087 阅读 · 0 评论 -
jquery each()方法的使用
1.直接遍历数组<body><table> <thead> <tr> <th>姓名</th> <th>年龄</th> </tr> </thead> <tbody> <tr> <td>zhangsan&...原创 2018-08-09 09:46:56 · 705 阅读 · 0 评论 -
form表单非空验证
1.在<head>里面引入jquery.js<script src="jquery.js"></script>2.dom元素如下<div class="register"> <form> <p class="info"></p> <div class="content"> ...原创 2018-08-08 17:52:47 · 12305 阅读 · 0 评论 -
jquery实现tab栏切换
1.在<head>里面引入jquery.js<script src="jquery.js"></script>2.css如下<style type="text/css"> * { margin: 0; padding: 0; } ul { list-style: none; } .wrapper...原创 2018-08-08 18:02:43 · 1091 阅读 · 0 评论 -
jquery+animate.css实现下一步操作
1.css 样式<link rel="stylesheet" href="animate.css" />.box{ width: 500px; overflow: hidden; }.slider{ width: 100%; float: left; display: none; }.slider.active{ display: block;...原创 2018-12-29 15:44:34 · 672 阅读 · 0 评论 -
jquery中阻止默认事件和事件冒泡的方法
1.在事件的处理中,可以阻止默认事件和冒泡事件。return false$("li").on('click',function(){ return false;})2.在事件的处理中,可以阻止默认事件但是允许冒泡事件的发生。e.preventDefault()$("li").on('click',function(e){ e.preventDefault()})...翻译 2018-10-22 10:25:48 · 3148 阅读 · 1 评论 -
jquery实现css属性transform的兼容的写法
$(".box").css({ "transform":"rotate(-2deg)", "webkitTransform":"rotate(-2deg)", "mozTransform":"rotate(-2deg)", "msTransform":"rotate(-2deg)", "height":"150px"})翻译 2018-10-15 16:00:31 · 8270 阅读 · 0 评论 -
自定义按钮实现video暂停和播放的方法
注:两个方法只能用于原生获取的<video></video>元素,对jquery获取的元素不管用1.play(); 实现播放 2.pause();实现暂停// dom元素如下<video width="800" height="400" id="video" controls="controls"> <source src="...翻译 2018-10-22 10:51:49 · 21820 阅读 · 4 评论 -
jquery实现点击元素让浏览器滚动到某个位置
点击回到顶部$("a").on('click',function(){ $("body,html").animate({scrollTop:0},2000); // 阻止默认事件 return false;})点击 浏览器滚动到某个位置 $(".register-now").click(function(){ // 获取当前元素偏移坐标 var awar...原创 2018-10-24 16:24:48 · 1275 阅读 · 0 评论 -
js判断元素是否存在
参考链接:https://www.cnblogs.com/ww03/p/6004234.htmljQuery检查某个元素在页面上是否存在// 应该根据获取元素的长度来判断,代码如下if($("#tt").length > 0) { //元素存在时执行的代码} JavaScript检查某个元素在页面上是否存在//js判断元素是否存在if(doc...翻译 2018-10-24 10:03:11 · 1371 阅读 · 0 评论 -
jquery实现折叠面板
1.dom元素<div class="box"> <ul id="ul"> <li>Client agreement <div class="line"></div> <div class="content"> <p>RISK WARNING: Trading leveraged d...原创 2018-10-25 10:26:52 · 2700 阅读 · 0 评论 -
jquery实现table表格的查询功能
dom元素<table border="1" cellpadding="5" cellspacing="0"> <thead> <tr> <th>姓名</th> <th>年龄</th> <th>学历</th> <th>工作性质</th&g...原创 2019-06-21 10:04:25 · 3837 阅读 · 0 评论 -
jquery+css 实现遮罩层
css代码<style type="text/css"> .modal{ position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); } .modal-content{ width: 100%; max-width: 500...原创 2019-06-10 10:29:31 · 507 阅读 · 0 评论 -
css 实现图图片旋转
<style>.box { width: 150px; height: 150px; background: url(login.png) no-repeat center center; background-size: cover; animation: rotate 2s infinite linear; -webkit-animation: rotate 2s ...翻译 2019-04-16 15:55:28 · 6255 阅读 · 0 评论 -
jquery.filter() 实现元素前3个显示,其余隐藏
1.dom元素如下<ul> <li class="info">1</li> <li>2</li> <li class="info">3</li> <li class="info">4</li> <li>5</li> <li>...原创 2018-08-09 16:12:26 · 5258 阅读 · 2 评论 -
jquery操作css属性
参考链接:http://www.w3school.com.cn/jquery/css_css.asp<script>$("p").css({ "color":"white", "background-color":"#98bf21", "background-position":"0 0", "font-family":"Arial", "font-si...翻译 2018-08-24 16:53:17 · 188 阅读 · 0 评论