天天看點

jquery 1.4參考手冊學習筆記

動畫函數:

stop()函數,其中括号内參數若寫,格式為 stop({clearQueue :true,gotoEnd:true})

動畫開關:顯示隐藏

<button id="go">Go</button>

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

 var flip = 0;

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

      $("p").toggle( flip++ % 2 == 0 );

  });  

flip++ % 2 == 0 ,判斷flip是為奇數或偶數

flip+1能被2整除,則為真,即flip為奇數則為真,偶數為假

後加加有滞後的特點,後加加之後還是原來的值,前加加之後立刻變為加後的值,是以首先設為0,後加加後依然為0,整除2可以除盡,則為true,即為show,是以首先顯示隐藏的元素,然後再一起隐藏、一起顯示。如果不加這個開關,直接寫toggle(),則為兩個p元素交替顯示與隐藏,而不能同時顯示與隐藏。

根據switch參數切換元素的可見狀态(ture為可見,false為隐藏)。

如果switch設為true,則調用show()方法來顯示比對的元素,如果switch設為false則調用hide()來隐藏元素。

jquery自定義插件

//    預設選中所有和預設不選中所有

    jQuery.fn.extend({

        check:function(){//這裡的this指代jquery對象,是以也是類數組,可以周遊,可以取長度

            return this.each(function(){this.checked=true;});

        },

        uncheck:function(){

            return this.each(function(){this.checked=false;})

        }

    });

    $("input[type=checkbox]").check();

$("input[type=radio]").uncheck();

    jQuery.extend({

        min:function(a,b){return a<b?a:b},

})

jQuery.fn.extend({

      test:function(){

//使用this   指代jquery對象

this.each(function(){

alert(this.value);//使用this-指代DOM對象

}

val(array)

val括号中可以寫數組,用在check和select上,相當于設定select,單選框和複選框的預設選中的值,而不是顯示的value文字

<select id="single">

  <option>Single</option>

  <option>Single2</option>

</select>

<select id="multiple" multiple="multiple">

  <option selected="selected">Multiple</option>

  <option>Multiple2</option>

  <option selected="selected">Multiple3</option>

</select><br/>

<input type="checkbox" value="check1"/> check1

<input type="checkbox" value="check2"/> check2

<input type="radio" value="radio1"/> radio1

<input type="radio" value="radio2"/> radio2

$("#single").val("Single2");

$("#multiple").val(["Multiple2", "Multiple3"]);

$("input").val(["check2", "radio1"]);

prepend(content)

<p>I would like to say: </p>

<b>Hello</b>

<b>Good Bye</b>

$("p").prepend( $(".foo")[0] );

結果:

<p><b>Hello</b>I would like to say: </p>

css({屬性名:“屬性值”})

屬性值如果有小杠作為連接配接符,則不寫,第二個單詞開頭字母大寫或者這個屬性使用引号也可以!

$("p").css({ "margin-left": "10px", "background-color": "blue" });

大括号裡隻要有一個地方錯的,則所有的都不能正常顯示

css(name,value)

eg:$(“p”).css(“background-color”,”red”);

$(“p”).css(“backgroundColor”,”red”);

前面的屬性名必須加雙引号,其中的屬性可以駝峰可以加小杠,涉及到px數值的,加引号,裡面必須寫機關,不加引号,直接寫數字就可以。

offset(坐标)

不是擷取偏移,是設定偏移,設定某個元素的相對于document對象的位置(relative)

position() 擷取比對元素相對父元素的偏移

事件對象

fn這個參數的回調函數還可以接受一個參數。當這個函數被調用時,一個JavaScript事件對象會作為一個參數傳進來。

這個事件對象通常是沒有必要且可以省略的參數,因為當這個事件處理函數綁定的時候就能夠明确知道他在觸發的時候應該做些什麼,通常就已經可以獲得充分的資訊了。然而在有些時候,在事件初始化的時候需要擷取更多關于使用者環境的資訊。可以參考完整的關于事件對象的内容。

在事件處理函數内傳回false就等價于執行事件對象上的.preventDefault()和.stopPropagation()。

可以像這樣在事件處理函數内使用事件對象:

$(document).ready(function() {

  $('#foo').bind('click', function(event) {

    alert('The mouse cursor is at ('

      + event.pageX + ', ' + event.pageY + ')');

  });

});

注意,這個參數添加到了一個匿名函數上。這個代碼可以讓使用者在點選ID為foo的元素時,報告滑鼠點選時相對于頁面的坐标。

<b>本文轉自 蓓蕾心晴 51CTO部落格,原文連結:</b><b>http://blog.51cto.com/beileixinqing/1863081</b><b>,如需轉載請自行聯系原作者</b>

繼續閱讀