jquery事件处理、查找、强大的表格变换颜色案例

事件处理

   ① bind:为每个匹配元素的特定事件绑定事件处理函数。

   

     例1：

        $("p").bind("click", function(){

           alert( $(this).text() );

          });

 

     例2：调用dom函数

 

       $("input[type=button]").bind("dblclick",aa);

 

      function aa(){

        

        alert("aa");

        }

 

   ②one:绑定一个一次性的事件处理函数。

   

     例:给段落表记绑定一个一次性的事件,只能调用一次

 

       $("p").one("click",function(){

                    

                     alert($(this).text());

                     });

 

 

查找

 

   ①children():每一个元素的所有子元素的元素集合。

 

     例:查找DIV中的每个子元素。

 

    $("#d2").children().each(function (index,domEle){

                    

                     alert(domEle.value);

                     });

 

  ②find():

 

    搜索所有与指定表达式匹配的元素。

   

    $("p").find("span").css("background-color","green");

 

  ③next():案例折叠

 

      取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈 

    元素的元素集合。

 

     $("span").click(function (){

 

        $(this).next().toggle("slow");

             

               }); 

 

 

  ④parent():

     取得一个包含着所有匹配元素的唯一父元素的元素集合。

 

    $("a").mouseover(function (){

                    

      $(this).parent().css("background","green");

                     });

 

  ⑤parents():重要

  

    用于筛选祖先元素的表达式

 

    $("span").parents(".d2").css("background","green");

 

val():

 

   例1：选中单选框radio中val值等于3号

 

 

    $("input[name=rad]").each(function (index,domEle){

                    

       if(domEle.value=='3号'){domEle.checked=true;}

                    

                     });

 

   例2：默认选中下拉菜单select为2号

  

       $("#sel2").val("2号");

 

   例3:默认下拉菜单同时选中2号和5号"

    

       $("select").eq(1).val(["2号","5号"]);    

 

   例4：默认复选框选中2号和5号

 

       $("input[name=box]").val(["2号","5号"]);