题外话:真得,俺折腾的不是jQuery,是寂寞!(忽见,锅碗瓢盆夹杂一堆不明物飞来……啊~哇~呀)
关注小博的童鞋朋友都知道,最近俺在疯狂得折腾jQuery,而且成果显著发文多多,也有用俺发出来的代码加到小站上的。独乐乐不如众乐乐,俺一人折腾不如一票人一起折腾。不过问题也随之出现了,有些小朋友不懂jQuery来着,而俺又是直接上代码来着,让他们看着代码兴叹怎么用呀!
好啦,这就把如何正确使用jQuery的方法步骤补上:
一、在header.php的head标签中加载jQuery库(非加不可):
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
当然,如果你觉得你的主机比GG更稳定更速度,那放本地也行的!
二、添加利用这个库让元素动起来的代码(可理解为命令代码):
$('#shang').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);}); $('#xia').click(function(){$('html,body').animate({scrollTop:$('#footer').offset().top}, 800);});
上面这段就是让首页文章列表左手边上的滑动按钮起作用的jQuery代码,那我们又该如何使用这个代码呢?有二个方法:
1.直接在header.php添加如下结构的代码:
<script type="text/javascript" > jQuery(document).ready(function($){ //注意要用这个把jQuery代码都包裹起来,不然里面的可都是无效的哦~ $('#shang').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);}); $('#xia').click(function(){$('html,body').animate({scrollTop:$('#footer').offset().top}, 800);}); //代码段二…… //代码段三…… }); </script>
2.推荐把方法1说的代码另存为.js文件:
jQuery(document).ready(function($){ $('#shang').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);}); $('#xia').click(function(){$('html,body').animate({scrollTop:$('#footer').offset().top}, 800);}); });
然后再在header.php的head标签中添加:
<script type="text/javascript" src="http://xxxooo.com/xxxooo.js"></script>
好了,回头看看也挺简单的吧?那以后俺可直接上jQuery代码咯!
相关推荐
《超实用的jQuery代码段》的代码跨平台、跨设备、跨浏览器,充分向读者演示了如何使用jQuery的各项技术,实现令人激动的网页效果。 《超实用的jQuery代码段》从jQuery框架的使用原理与应用场景出发,对最实用的...
其次详细讲解了jQuery的各种选择器、jQuery操作DOM的方法、jQuery中的事件与应用、jQuery中的动画和特效、Ajax在jQuery中的应用,以及各种常用的jQuery插件的使用方法和技巧...
6. 如何正确地使用ToggleClass: 4 7. 如何设置IE特有的功能: 4 8. 如何使用jQuery来代替一个元素: 4 9. 如何验证某个元素是否为空: 4 10. 如何从一个未排序的集合中找出某个元素的索引号 4 11. 如何把函数绑定到...
主要为大家详细介绍了Vue中正确使用jQuery的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
一个非常简单好用的jQuery对联广告代码 直接引入jQuery插件,本插件,然后再来一个调用方法即可,简单易用,不会出现冲突 使用方法: 1、引入index.html head中的css样式 2、引入body中的代码部分即可 ...
一个非常简单好用的jQuery对联广告代码 直接引入jQuery插件,本插件,然后再来一个调用方法即可,简单易用,不会出现冲突 使用方法: 1、引入index.html head中的css样式 2、引入body...
jquery弹出注册框代码是一款点击登录或者注册按钮后,渐变弹出一个对话框,可以直接登录或者注册,注册框也可自动判断输入正确与否。 jquery弹出注册框代码注册演示图: 点击查看演示: jquery弹出注册...
这是一款非常实用的jQuery表单个人信息格式验证代码,可以判断手机号码,电子邮箱,中文姓名,号码等格式输入是否正确。
1.正确引用jQuery 1.尽量在body结束前才引入jQuery,而不是在head中。 2.借助第三方提供的CDN来引入jQuery,同时注意当使用第三方CDN出现问题时,要引入本地的jQuery文件。(对于已经使用了cdn的网站可以忽略,现在...
jQuery手机手势密码图案解锁代码基于jquery-2.1.4.min.js和jquery.gesture.password.js制作,九宫格样式,正确的密码是一个字母“Z”的形状哦!
jQuery 代码: $("p").css("color"); toggle(fn,fn) 每次点击时切换要调用的函数。 如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。随后的每次点击都重复对这...
基于jquery的一个提示弹窗,包含了正确、错误和警告提示。
功能介绍:jQuery多功能注册表单验证插件代码,能够验证几乎所有字段,让你自定义错误提示的长度,提示内容,提示字体颜色,还能与php动态验证手机号或者用户名在数据库是否存在,还能验证身份证是否输入正确,还能配合短信...
jQuery是一款免费且开放源代码的JS代码库,由John Resig创建,它是轻量级的js库,兼容CSS3,兼容各种浏览器(IE6.0 , FF1.5 , Safari2.0 , Opera9.0 )。jQuery 3.3.1 更新日志:2018-01-31核心确保jQuery.holdReady...
本篇文章是入门第一篇, 主要是简单介绍jQuery, 通过简单示例指导大家如何编写jQuery代码以及搭建开发环境. 详细讲解了如何在Visual Studio中配合使用jQuery. 转载请注明子秋出品!博客园首发! 二.前言 首先道个...
jquery AJAX 回调函数取JSON成功代码,不需要数据库,jquery路径引导正确可运行,数据调用是已定义json数据
jQuery 使用 $ 符号作为 jQuery 的简介方式。 某些其他 JavaScript 库中的函数(比如 Prototype)同样使用 $ 符号。 jQuery 使用名为 noConflict() 的方法来解决该问题。 var jq=jQuery.noConflict(),帮助您使用...
jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码。下面我们来看下jQuery中绑定事件的方式都有哪些。 ...
常用的jQuery图片左右轮播效果,同时支持底部缩略图左右滚动展示 点击大图片后支持放大效果 使用方法: 1、将head中的js以及css拷贝到你的网页中 2、将代码部分拷贝到你需要的地方即可 3、注意...