以下几个 jQuery 技巧,也许你工作中能够用上。 1....$(this).hasClass('broken-image')) { $(this).prop('src', 'img/broken.png').addClass('broken-image...那么你可以在用户悬停的时候添加类到元素中,反之则删除类: $('.btn').hover(function () { $(this).addClass('hover'); }, function...淡入 / 滑动切换 滑动和淡入都是我们用 jQuery 做动画的时候大量运用的东西。如果你只是想在用户点击之后展示一个元素的话,那么用 fadeIn 和 slideDown 方法就很完美。...如果没有定义处理程序,其他的 jQuery 代码或会就此罢工。
$(this).hasClass('broken-image')) { $(this).prop('src', 'img/broken.png').addClass('broken-image'); }...那么你可以在用户悬停的时候添加类到元素中,反之则删除类: $('.btn').hover(function () { $(this).addClass('hover'); }, function ()...添加 disabled属性到你的输入就可以在你想要的时候才启用它: $('input[type="submit"]').prop('disabled', true); 然后你只需要运行输入的prop 方法就可以了...,不过disabled 的值要设置为false: $('input[type="submit"]').prop('disabled', false); 7、停止加载链接 有时候,你既不需要链接到某个特定的网页...如果没有定义处理程序,其他的jQuery代码或会就此罢工。
你可以根据按钮的不同情况,为前面HTML代码中第1个div区块,添加相应的class。 i. 如果一个按钮是主按钮,那么添加"goog-imageless-button-primary"。...如果一个按钮保持选中状态,那么添加"goog-imageless-button-checked"。 第四步,用Javascript加入动作代码。我使用的库是jQuery。 i....$(".goog-imageless-button").hover( function(){ if(!...$(this).hasClass("goog-imageless-button-disabled")){ $(this).addClass("goog-imageless-button-hover...$(this).hasClass("goog-imageless-button-disabled")){ $(this).removeClass("goog-imageless-button-hover
,因此请确保您已经提前引入jQuery,否则不能正常使用。... $.fn.postLike = function() { if ($(this).hasClass('done')) {...font-size: 12px;padding: 5px 10px;text-decoration: none;outline:none} .post-like a.done, .post-like a:hover...但如果您网站启用了CDN,或使用了WP-Super-Cache这类静态缓存插件后,页面会被提前缓存起来,这样判断也就失效了,便可以无限点赞,于是xiaoz进行了改进,通过js再判断一次COOKIES是否存在...} } } return cookieValue; } $.fn.postLike = function() { if ($(this).hasClass
(class) $( 'div ’ ).hasClass(“protected”) 检查当前的元素是否含有某个特定的类,如果有,则返回true eq(index) $(“li”).eq(2); 相当于$...中指操作指定类名,不影响原先的类名 3.2 jQuery效果 注意: 动画或者效果一旦触发就会执行,如果多次触发,就造成多个动画或者效果排队执行。...中有hover()事件,功能类似于css中的hover hover(function,function) 传入2个参数,第一个参数是鼠标移入是触发的函数,第二个是鼠标移出时触发的函数 只写一个参数时...,则修改样式 参数不写单位 4.4.2 jQuery 位置操作 offset()设置获取元素偏移 获取的位置是相对于文档的偏移坐标,与父级没有关系 传入的参数是一个对象 //获取偏移量 $('div'...,return false 阻止冒泡 : event.stopPropagation() 6.1.1 拷贝对象 $.extend([deep], target, obj1) [deep],深拷贝为true
过滤 eq(index|-index):获取指定索引的元素.如果是正数,索引从0开始;若是负数,倒着数从1开始. first():第一个 last():最后一个 hasClass(...)...事件切换 hover 在mouseover和mouseout之间进行切换 toggle 点击事件切换,点击第一次执行 fn,点击第二次执行fn2......../js/jquery-1.8.3.js"> $(function(){ $("#e02").hover(function...,如果显示就隐藏。...([毫秒值],[fn]):切换 若有则淡出,若无则淡入 <!
图片轮播(左右切换)--js原生和jquery实现 左右切换的做法基本步骤跟 上一篇文章 淡入淡出 类似,只不过修改了一些特定的部分 ?...,并设定为有限banner宽度下隐藏超出宽度的部分 然后当想切换到某序号的图片时,则采用其ul 定位 left样式设定相应属性值实现 比如显示第一张图片初始定位left为0px, 要想显示第二张图片则需要...indexList .indexOn{background: red;font-weight: bold;color: white;} (3)页面基本已经构建好久可以进行js的处理了 一、jQuery.../js/jquery.min.js"> 60 61 var curIndex = 0, //当前index...我试过了,如果不初始或者把初始的left值写在行内css样式表里边,就总会报错取不到 所以直接在js中初始化或者在html中内嵌初始化也可。
//这种情况下有些开发者使用: a.hasClass('blueButton') ?...", function(){ $(this).toggleClass("hover"); }); }); //现在用 $("table").delegate("td", "hover...,如果它们在加载时为被选中状态的话 $('a').click(function() { $("input[type=checkbox]").attr("checked",!...$('input').data('validation.isValid', true); 如何检查cookie是否启用 var dt = new Date(); dt.setSeconds(dt.getSeconds...cookiesEnabled) { //没有启用cookie } 如何让cookie过期: var date = new Date(); date.setTime(date.getTime(
最近工作中用到了jQuery UI中排序和拖拽功能,花了大概一天的时间,搞清楚了大概的参数配置,以及遇到的一些问题,总结如下。...如果值设置为"clone", 那么该元素将会被复制,并且被复制的元素将被拖动。...revert: 'invalid', // 如果设置为true,当拖动停止时,元素位置将被重置。...droppable({ // accept: selector, // accept: function(d) { // if($(this).hasClass.../sortable/ https://www.html.cn/jquery-ui-api/draggable/ https://www.html.cn/jquery-ui-api/droppable
通常情况下:一级菜单都是横向导航,二级菜单都是左侧边栏,如果有三级,放到内容页,实例图如下所示: ?...点击事件:先用 jQuery 选择器选中【全部团购分类】,再选中团购分类下的无序列表,点击【全部团购分类】让列表显示和隐藏。...$(this).hasClass('nochild')){ if($(this).hasClass("prosahover")){...$(this).hasClass('nochild')){ if($(this).hasClass("prosahover")){ $(this).removeClass("prosahover...5 总结 此效果为大多数电商网站首页菜单必须部分,如京东、淘宝等。
,这一点也是比较片面的,毕竟要使用 jq 才行(有一款纯js的,不过安装比较麻烦),那么首先引入 jq jquery@...标签就ok href 填写图片路径即可 其他 因为我图片启用了...全局启用后有的不需要 fancybox 效果的页面图片也被应用了 fancybox 效果,所以加了个父元素是否为 a 标签的判断。...container 内包含了 ibox,会导致的问题是有 ibox 页面 img 都会被包裹) 以上判断均有 bug 尝试了几种方案,其中最合适的还是 直接遍历 img 所有父元素,判断是否能匹配指定类名,是则文章页面...img.wrap('') : false; box.hasClass('news-article-container
图片轮播(淡入淡出)--js原生和jquery实现 图片轮播有很多种方式,这里采用其中的 淡入淡出形式 js原生和jQuery都可以实现,jquery因为封装了很多用法,所以用起来就简单许多,转换成...要注意的是,imgList中图片的宽度和高度最后马上设定,如果在css中才统一设定会变慢一些。...,所以要在banner那里加上overflow:hidden ,不然如果快速切换图片的话,整体图片高度会超出所给的高度。...如果已经显示好,再增添js处理部分。...然后设置curIndex为当前item(这个要注意别忘了) 滑出重置定时器,还原默认状态了 这样一来,淡入淡出就完成了。 完整代码 1 <!
b 不重复,则将 b 添加进 a 里 ③ 最后使用elem.setAttribute("class",a)完成 二、$().removeClass 作用: 移除类,如果没有参数,则移除目标元素所有类名...,则删除所有类 if ( !...value, //如果value是string类型或者是数组类型的话,为true,反之为false isValidValue = type === "string" ||...//如果目标元素存在setAttribute的方法话 if ( this.setAttribute ) { //如果已有类名/value=false,则移除所有类名...判断是否 add/removeClass (3)如果$.toggleClass()没有值或者第一个值为 true 的话 如果目标元素有类名的话,就使用dataPriv来保存类名, 如果目标元素有setAttribute
height:50px; line-height: 50px; text-decoration: none; text-align:center; } #menu ul li a:hover...取得当前对象 var itemTop = m.offset().top; // 获得当前item的距离顶位置 if(top > itemTop-200){ // 如果用户滚动的距离比当前...item的距离顶部位置少200px currentId = "#" + m.attr("id"); // 设置currentId 为当前id } else...== currentId){ // 如果currentId不是空并且当前导航的href不是当前的id currentLink.removeClass("current"); //...hasClass(obj, cls)) { obj.className += " " + cls; } }*/
隐式迭代: 设置操作的时候,如果是多个元素,那么给所有的元素设置相同的值 获取操作的时候,如果是多个元素,那么只会返回第一个元素的值。...removeClass(“name”); //例子,移除div中one的样式类名 $(“div”).removeClass(“one”); 判断是否有样式类 //name:用于判断的样式类名,返回值为true...false hasClass(name) //例子,判断第一个div是否有one的样式类 $(“div”).hasClass(“one”); 切换样式类 //name:需要切换的样式类名,如果有...,移除该样式,如果没有,添加该样式。...tbody tr { background-color: #f0f0f0; text-align: center; } tbody tr:hover
如果返回为对象,却找不到这个对象时,通常会返回null 3. Boolean类型:只有两个字面值,true和false。...isFinite():判断是否为有限数值,如果是则返回true,否则返回false。 特殊数值::NaN (not a number) 即表示不是一个数字,则isNaN判断不是数字时返回true。...NaN不能用于计算alert(NaN == NaN) //返回false 可用方法:isNaN(),判断是否为”不是数字”,不是数字则返回true,是数字则返回false。 5....是对象的占位符 “function” 表示这个值是函数 三、JavaScript实现jQuery中的addClass()、removeClass()、hasClass() hasClass(ele,cls)) ele.className += " "+cls; } function removeClass(ele,cls) { if (hasClass(
jQuery顶级对象 缩写$ window.jQuery window.$ 第一部分,找对象 其本选择器 $("#id") $(".class") ...contains('John')") 匹配包含给定文本的元素 属性过滤选择器 $("div[id]")选取有id属性 $("div[title=test]")选取title属性为test...addClass("myclass")(不影响其他样式) class="c1 c2" removeClass("myclass")移除样式 toggleClass("myclass")如果存在样式则去掉样式...,如果没有样式则添加样式 .例子,做开关灯的时候 hasClass("myclass")判断是否存在样式 设置属性 attr("class","c1") 对class属性赋值... toggle hover(enterfn,leavefn) 当鼠标放上时执行enterfn,当鼠标离开时执行leavefn toggle(fn1,fn2) 当鼠标第一次点击时执行
jquery教程之查找筛选函数 一、eq 获取当前链式操作中第N个jQuery对象,返回jQuery对象 $("p").eq(1) 从0开始 $("p:eq(1)") 二、hasClass 检查当前的元素是否含有某个特定的类...,如果有,则返回tru $("p").hasClass("red") 三、children 取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。