标签：style blog http io ar color os 使用 sp
show()和hide()方法可以用来显示和隐藏元素，toggle()方法用来切换显示和隐藏。
$(selector).hide(speed,[callback]);
$(selector).show(speed,[callback]);$(selector).toggle(speed,callback);
speend 可以设置为fast slow或者数字（毫秒），cellback是回调函数
slideUp()和slideDOwn()以及用来自动切换的slideToggle(),这个是上下滑动效果。细心的同学可能发现了，toggle这个词出现的时候一般都是用来切换的。所有以后看***toggle()这种方法的时候应该很快就能反映过来这是***的一个单击切换方法。
$(selector).slideUp(speed,[callback]);
$(selector).slideDown(speed,[callback]);$(selector).slideToggle(speed,callback);
fadeIn() fadeOut() fadeTo() fadeToggle()这个四个方法是用来做淡入淡出效果的
$(selector).fadeIn(speed,[callback]);
$(selector).fadeOut(speed,[callback]);
$(selector).fadeTo(speed,opacity,callback);
$(selector).fadeToggle(speed,callback);opacity的取值0-1。0代表透明，1代表不透明。
animate()方法用来制作动画效果，
$(selector).animate({params},speed,callback);params是css的参数，在{}里面写css代码即可。下面举个例子
<!DOCTYPE html> <html> <head> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ $("div").animate({left:‘250px‘}); }); }); </script> </head> <body> <button>Start Animation</button> <p>By default, all HTML elements have a static position, and cannot be moved. To manipulate the position, remember to first set the CSS position property of the element to relative, fixed, or absolute!</p> <div style="background:#98bf21;height:100px;width:100px;position:absolute;"> </div> </body> </html>
注意：默认情况下，所有 HTML 元素都有一个静态位置，且无法移动。如需对位置进行操作，要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute！
stop()方法用来停止当前执行的动画。
$(selector).stop(stopAll,goToEnd);
stop()有的两个参数，在默认情况下都是false。
第一个参数是用来判断是否所有的动画。在false的情况下，stop只会停止当前的动作，但是后续的动作不会停止，如果把stopAll设置为true则会停止当前和后续的所有动作。
第二个参数是用来立即完成当前动画的。在两个参数都为true的情况下会立即执行完当前动画，并停止后续所有动画。当stopAll为false，goToend为true的时候会立即执行完当前动画，后续动画会在这个动画完成后立即执行。
建议大家自己动手实践下，效果一下就看出来了。
delay()方法用来设置延迟，调用的时候是对下一个动画设置的延迟，也就是说延迟的时间是从当前动画完成后开始计算的。这个方法不能设置当前的动画的延迟。
$(selector).delay(speed,queueName)
load()方法从服务器加载数据，并把返回的数据放入被选元素中。
$(selector).load(URL,data,callback);
必需的 URL 参数规定您希望加载的 URL。
可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
可选的 callback 参数是 load() 方法完成后所执行的函数名称。
在加载文件的时候可以选择文件其中制定的元素，例如加载”demo_test.txt”中的p1
$("#div1").load("demo_test.txt #p1");
可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数：
get()和post()方法
$.get(URL,callback);
$.post(URL,data,callback);get:必需的 URL 参数规定您希望请求的 URL。
可选的 callback 参数是请求成功后所执行的函数名。
下面的例子使用 $.get() 方法从服务器上的一个文件中取回数据：
$("button").click(function(){
$.get("demo_test.html",function(data,status){
alert("Data: " + data + "nStatus: " + status);
});
});set:必需的 URL 参数规定您希望请求的 URL。
可选的 data 参数规定连同请求发送的数据。
可选的 callback 参数是请求成功后所执行的函数名。
下面的例子使用 $.post() 连同请求一起发送数据：
$("button").click(function(){
$.post("demo_test_post.html",
{
name:"Donald Duck",
city:"Duckburg"
},
function(data,status){
alert("Data: " + data + "nStatus: " + status);
});
});{ name:"Donald Duck", city:"Duckburg" }这是个JSON对象。具体内容百度JSON。
这是最基本的三个方法，更多ajax方法请参见http://www.w3cschool.cc/jquery/jquery-ref-ajax.html
在使用插件前，记得需要先引用。
表单验证插件-validate
这个插件的内容挺多的，具体用到的时候请参考http://www.w3cschool.cc/jquery/jquery-plugin-validate.html
ajaxform()方法用来提交表格，并可以获取返回值。$(form). ajaxForm ({options}) 参考： http://www.360doc.com/content/13/1001/17/1542811_318406421.shtml
lightBox()图片灯箱插件
该插件可以用圆角的方式展示选择中的图片，使用按钮查看上下张图片，在加载图片时自带进度条，还能以自动播放的方式浏览图片，调用格式如下：
$(linkimage).lightBox({options})
options的参数，参考http://code.ciaoca.com/jquery/lightbox/
jqzoom()放大镜
在调用jqzoom图片放大镜插件时，需要准备一大一小两张一样的图片，在页面中显示小图片，当鼠标在小图片中移动时，调用该插件的jqzoom()方法，显示与小图片相同的大图片区域，从而实现放大镜的效果，调用格式如下：
$(linkimage).jqzoom({options})
其中linkimage参数为包含图片的<a>元素名称（即大图片），options为插件方法的配置对象。参数和实例参考http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819887.html
cookie插件可以很方便地通过cookie对象保存、读取、删除用户的信息，还能通过cookie插件保存用户的浏览记录，它的调用格式为$.cookie(名称,值,[option])
具体内容参考http://www.cnblogs.com/kissdodog/archive/2012/12/14/2818827.html
autocomplete()搜索插件的功能是通过插件的autocomplete()方法与文本框相绑定，当文本框输入字符时，绑定后的插件将返回与字符相近的字符串提示选择，调用格式如下：
$(textbox).autocomplete(urlData,[options]);
其中，textbox参数为文本框元素名称，urlData为插件返回的相近字符串数据，可选项参数options为调用插件方法时的配置对象。
options的参考网址：http://www.jb51.net/article/24219.htm
contextMenu()右键菜单插件可以绑定页面中的任意元素，绑定后，选中元素，点击右键，便通过该插件弹出一个快捷菜单，点击菜单各项名称执行相应操作，调用代码如下：
$(selector).contextMenu(menuId,{options});
Selector参数为绑定插件的元素，meunId为快捷菜单元素，options为配置对象。
options的参考网址：http://www.blogjava.net/supercrsky/articles/250091.html
http://fs20041242.iteye.com/blog/830889
现在网上有很多各种各样的插件，在具体项目需要的时候再百度下，应该会了解到更多实用的插件。
draggable()
拖曳插件draggable的功能是拖动被绑定的元素，当这个jQuery UI插件与元素绑定后，可以通过调用draggable()方法，实现各种拖曳元素的效果，调用格式如下：
$(selector). draggable({options})
options参数为方法调用时的配置对象，根据该对象可以设置各种拖曳效果，如“containment”属性指定拖曳区域，“axis”属性设置拖曳时的坐标方向。
更多options参考：http://www.w3cschool.cc/jeasyui/plugins-base-draggable.html
http://www.cnblogs.com/tyxloveyfq/archive/2013/04/27/3046732.html
（未完待续）
标签：style blog http io ar color os 使用 sp
原文地址：http://www.cnblogs.com/Moose/p/4146934.html
