天天看點

Jquery 處理方法參數

表單驗證

$('form:input').blur(function(){

           var checkEmail=/.+@.+\.[a-zA-Z]{2,4}$/;

            if($(this).is('#email')){

                      if(this.value==""||!checkEmail.test(this.value)){

                        ·····

                      }

            }

            if($(this).is('#username')){

             ······

             }

}).keyup(function(){

           $(this).triggerHandler("blur");

}).focus(function(

           $(this).triggerHandler("blur");

))

表格隔行變色

CSS

 .even{background:#FFF38F;}

 .odd{background:#FFFFEE;}

$(function(){

        $("tbody>tr:odd").addClass("odd");

        $("tbody>tr:even").addClass("even");

        $("tr:contains('王武')").addClass("odd");

        //另外一種用法

        $('tr').filter(":contains('李')").addClass('odd');

})

單選框控制表格高亮

$('tbdoy>tr').click(function(){

         $(this).addClass('selected').siblings().removeClass('selected').end()

         .find(':radio').attr('checked',true);

複選框控制表格行高亮

         if($(this).hasClass('selected')){

         $(this).removeClass('selected').find(':checkbox').attr('checked',false);

 }else{

         $(this).addClass('selected').find(':checkbox').attr('checked',true);

 }

}

三元運算----添加或移除selected類

var hasSelected=$(this).hasClass('selected');

$(this)[hasSelected?"removeClass":"addClass"]('selected');

表格展開關閉

<tbody>

 <tr class='parent' id='row_01'><td>第一行</td></tr>

 <tr class='child_row_01'><td>第一行子集</td></tr>

</tbody>

$('tr.parent').click(function(){

 $(this).toggleClass("selected")  //添加、删除高亮

 .sibings('.clild_'+this.id).toggle(); 影藏、顯示所謂的子行

網頁頁籤切換

var $ div_li=$("div.tab_menu ul li");

$div_li.click(function(){

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

 var index=$div_li.index(this);

 $("div.tab_box>div").eq(index).show().sibings().hide();

}).hover(function(){

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

},function(){

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

異步  (表單序列化元素)

$.ajax({

 type:"get",

 url:"test.json",

 dataType:html/script/json/jsonp/text,

 data:$("#form1").serialize(),

 beforeSend:function(){

 },

 complete:function(){

 success:function(data){ 

 error:function(){

JSONP

 flightHandler({

    "code": "CA1998",

    "price": 1780,

    "tickets": 5

});

$.ajax({            

    type: "get",           

    async: false,                 

 url:"http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998",

    dataType: "jsonp",             

 jsonp:"callback",//傳遞給請求處理程式或頁面的,用以獲得jsonp回調函數名的參數名(一般預設為:callback)             jsonpCallback:"flightHandler",//自定義的jsonp回調函數名稱,預設為jQuery自動生成的随機函數名,也可以寫"?",jQuery會自動為你處理資料 

    success: function(json){

            alert('您查詢到航班資訊:票價: ' + json.price + ' 元,餘票: ' + json.tickets + ' 張。');

    },

    error: function(){

             alert('fail');

    }

最下端滾輪加載事件

下一篇: LVS