Jquery总结（二）

 9、效果

  基本：

    1、$("p").show() 显示隐藏的匹配元素

    2、$("p").hide() 隐藏显示的元素

    3、$("p").show("slow"); 以优雅的动画显示全部匹配的元素，并在显示完成后可选地触发一个回调函数。

      speed (String,Number) : 三种预约速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000)

callback (Function) : (Optional) 在动画完成时执行的函数，每一个元素执行一次。

   用迅速的动画将隐藏的段落显示出来，历时200毫秒。并在以后执行反馈！

   <p style="display: none">Hello</p>

   jQuery 代码:

   $("p").show("fast",function(){

   $(this).text("Animation Done!");

   });

   4、$("p").hide("slow"); 以优雅的动画隐藏全部匹配的元素，并在显示完成后可选地触发一个回调函数。

   5、$("p").toggle() 切换元素的可见状态

   6、$("p").toggle("slow"); 以优雅的动画切换全部匹配的元素，并在显示完成后可选地触发一个回调函数

淡入淡出:

1、$("p").fadeIn("slow"); 经过不透明度的变化来实现全部匹配元素的淡入效果，并在动画完成后可选地触发一个回调函数

2、$("p").fadeOut("slow"); 经过不透明度的变化来实现全部匹配元素的淡出效果，并在动画完成后可选地触发一个回调函数。

3、$("p").fadeTo("slow", 0.66);$("p").fadeTo("slow", 0.66); 把全部匹配元素的不透明度以渐进方式调整到指定的不透明度，并在动画完成后可选地触发一个回调函数

自定义：

   1、$("#block").animate({

    width: "90%",

    height: "100%",

    fontSize: "20em",

    borderWidth: 10

201}, 1000 );用于建立自定义动画的函数。

10、事件

   事件处理：

   1、$("p").bind("click", function(){ alert( $(this).text() );}); 为每个匹配元素的特定事件（像click）绑定一个事件处理器函数

   2、$("p").one("click",function(){alert(${this}.text());}) 当全部段落被第一次点击的时候，显示全部其文本

   3、trigger(type,[data])在每个匹配的元素上触发某类事件

事件委派：$("p").live("click", function(){$(this).after("<p>Another paragraph!</p>");});。给全部当前以及未来会匹配的元素绑定一个事件处理函数（好比click事件）。也能绑定自定义事件。与bind()不一样的是，live()一次只能绑定一个事件

事件切换:一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法

   $("td").hover(

function () {

    $(this).addClass("hover");

},

function () {

    $(this).removeClass("hover");

}

);鼠标悬停的表格加上特定的类

 

4、每次点击后依次调用函数。

$("td").toggle(

function () {

    $(this).addClass("selected");

},

function () {

   $(this).removeClass("selected");

}

);

5、事件:

   1、$("p").blur(); 触发每个匹配元素的blur事件

   2、$("p").blur( function () { alert("Hello World!"); } ); 在每个匹配元素的blur事件中绑定一个处理函数

   3、change()；change事件会在元素失去焦点的时候触发，也会当其值在得到焦点后改变时触

   4、change(fn);在每个匹配元素的change事件中绑定一个处理函数。

   5、$("p").click(); 触发每个匹配元素的click事件

   6、$("p").click(function(){});在每个匹配元素的click事件中绑定一个处理函数

   7、dblclick()；dblclick事件会在元素的同一点双击时触发。

   8、$("p").dblclick( function () { alert("Hello World!"); }); 在每个匹配元素的dblclick事件中绑定一个处理函数。

   9、$(document).ready(function(){ $("#login").focus();}); 触发每个匹配元素的focus事件。

   10、$("input[type=text]").focus(function(){this.blur();}); 在每个匹配元素的focus事件中绑定一个处理函数。

   11、keydown()；keydown事件会在键盘按下时触发。

   12、keydown(fn)；在每个匹配元素的keydown事件中绑定一个处理函数。

   13、keypress()；触发每个匹配元素的keypress事件

   14、keypress(fn)；在每个匹配元素的keypress事件中绑定一个处理函数。

   15、keyup()；触发每个匹配元素的keyup事件

   16、keyup(fn)；在每个匹配元素的keyup事件中绑定一个处理函数。

   17、mousedown();

   18、mouseup();

   19、mousemove();

   20、mouseover();

   21、mouseout();

   22、$("form:first").submit();提交本页的第一个表单。

   23、$("form").submit(function(){return false;});阻止页面提交。

11、ajax

      ajax请求：

       1、通有方式：$.ajax(prop);prop是一个hash表，它能够传递的key/value有如下几种:

         (String)type：数据传递方式(get或post)。

         ((String)url：数据请求页面的url

         ((String)data：传递数据的参数字符串，只适合post方式

         ((String)dataType：期待数据返回的数据格式(例如 "xml", "html", "script",或 "json")

         ((Boolean)ifModified： 当最后一次请求的相应有变化是才成功返回，默认值是false

         ((Number)timeout:设置时间延迟请求的时间。能够参考$.ajaxTimeout

         ((Boolean)global：是否为当前请求触发ajax全局事件，默认为true

         ((Function)error：当请求失败时触发的函数。

         ((Function)success：当请求成功时触发函数

         ((Function)complete：当请求完成后出发函数

     

      2、$.get(url, params, callback) 用get方式向远程页面传递参数，请求完成后处理函数，除了url外，其它参数任意选择！

         eg:$.get(   "ajax.asp",

            { name: "young", age: "25" },

            function(data){ alert("Data Loaded: " + data); }

          )

      3、$.getJSON(url, params, callback) 用get方式向远程json对象传递参数，请求完成后处理函数callback

      4、$.post(url, params, callback) 用post方式向远程页面传递参数，请求完成后处理函数callback

12、工具类

数组和对象操做：

     1、$.each(obj,callback); 通用例遍方法，可用于例遍对象和数组。回调函数拥有两个参数：第一个为对象的成员或数组的索引，第二个为对应变量或内容。

       $.each( [0,1,2], function(i, n){alert( "Item #" + i + ": " + n );});

     2、jQuery.grep(array,callback,[invert])；使用过滤函数过滤数组元素，此函数至少传递两个参数：待过滤数组和过滤函数

     3、$.map(array,callback);将一个数组中的元素转换到另外一个数组中

     4、$.inArray(value,array);肯定第一个参数在数组中的位置(若是没有找到则返回 -1 ),从0开始。

     5、$.merge( [0,1,2], [2,3,4] ) ；合并两个数组。返回的结果会修改第一个数组的内容——第一个数组的元素后面跟着第二个数组的元素，不去掉重复项。

     6、$.unique(array);删除数组中重复元素

     7、$.trim(" hello, how are you? "); 去掉字符串起始和结尾的空格

     8、$.isArray(obj);测试对象是否为数组。

     9、$.isFunction(obj); 测试对象是否为函数

   URL:

   1、$.param(obj);将表单元素数组或者对象序列化。是.serialize()的核心方法。

     eg:var params = { width:1680, height:1050 }; var str = jQuery.param(params);

   2、$("form").serialize() ；序列表单内容为字符串，用于 Ajax 请求

十3、jquery操做单选框

   if($("input[type='radio']:checked")){

     var tt=$("input[name='chk']:checked").val();

}

十4、jquery操做复选框

    var chkArr="";

$(".cc:checked").each(function(){

       chkArr+=$(this).val()+"|";

});

1

十5、jquery实现复选框全选

   var checked=$("#allchk").attr("checked");

$(".ww").each(function(){

   if($(this).attr("checked")!=checked){$(this).click();}

});