2014-11-16 55 views
0
$(document).ready(function(c) { 
    $('.alert-close').on('click', function(c){ 
    $(this).parent().fadeOut('slow', function(c){ 
    }); 
    }); 
}); 

在這段代碼中function(c)是什麼意思?文檔就緒函數參數的用途是什麼?

+0

事件監聽器。 – simonzack

+0

@simonzack先生感謝您的關注,請讓我知道......它做了什麼? – Mani

+0

它在文檔準備就緒時執行。 – plalx

回答

0

jQuery.on() | jQuery API Documentation

.on(events [, selector ] [, data ], handler); 
  • 處理 Type: Function(Event eventObject [, Anything extraParameter ] [, ... ])是:

    函數時被觸發事件而執行的。 false值也可以作爲簡單返回false的函數的簡寫。

因此,function(c)是事件發生時將執行的函數的頭部; c是傳遞給事件主體的事件對象。許多程序員使用evente所以要記住的說法表示會更容易:

function(c) //head of handler 
{ //body of handler start 
    //the code that will be executed 
} //body of handler end 

在它自己的function(c)意味着什麼,並沒有任何用處;它的一部分匿名功能,事件處理程序,如果你願意的話,每次發生event時都會執行。

0

$(document).ready在文檔(DOM)準備就緒時需要執行參數中的偵聽器函數。

jQuery函數作爲參數傳遞給ready偵聽器函數。

$.noConflict()被調用時這很有用,因爲在這種情況下,$變量被恢復並且不再引用jQuery

通常不會依賴$,因爲您永遠不會知道$.noConflict()將被調用或不被調用。

這裏就是會更有意義:

jQuery(document).ready(function ($) { 
    //can use $ safely to reference jQuery in here 
}); 

(function ($) { 
    //can use $ safely to reference jQuery in here 
    $(document).ready(function() { 

    }); 
})(jQuery); 

現在,對於其他形式,如$('.alert-close').on('click', function(c) {然後c沒有指向jQuery。相反,它引用event object,其中可以使用獲取有關該事件的詳細信息或取消它/停止傳播。

請注意,它不是使用事件對象,那麼你可以做$('.alert-close').on('click', function() {

最後,按照慣例,人們將使用事件對象的e變量而不是c

下面是如何這可能會被改寫,使更多的意義:

jQuery(document).ready(function($) { 
    $('.alert-close').on('click', function() { 
    $(this).parent().fadeOut('slow'); 
    }); 
}); 
0
  • 你的情況c可以任意命名(我更喜歡稱之爲event)。
  • 它是一種trigger
  • 後給出的Callback containes Event Object(jQuery的Documentation
  • Event Object一個Callback這就是基於由W3給出的標準輸出(ECMAScript

Event Object包含數據連接到觸發器。在on函數中它包含如下數據:

  • typeArg參數是一個字符串。
  • canBubbleArg參數是一個布爾值。
  • cancelableArg參數是一個布爾值。
  • viewArg參數是實現AbstractView接口的對象。
  • detailArg參數是一個數字。
  • screenXArg參數是一個數字。
  • screenYArg參數是一個數字。
  • clientXArg參數是一個數字。
  • clientYArg參數是一個數字。
  • ctrlKeyArg參數是一個布爾值。
  • altKeyArg參數是一個布爾值。
  • shiftKeyArg參數是一個布爾值。
  • metaKeyArg參數是一個布爾值。
  • buttonArg參數是一個數字。
  • relatedTargetArg參數是實現EventTarget接口的對象。

見(documentation

它不使用Callback要求。但在某些情況下非常有用(例如在ajax調用中)

0

C是事件偵聽器對象。如果事件偵聽器對象具有任何屬性,則可以在函數調用中調用它們。所有的事件都是不同的,所以你必須看看API,看看你的代碼是否有任何需要。就目前來看,c沒有必要,因爲你沒有使用它。

這裏是一個的jsfiddle來說明:

http://jsfiddle.net/larryjoelane/qwawg9u4/6/

下面是小提琴的JavaScript代碼:

 $(document).ready(function(c) { 
     $('.alert-close').on('click', function(c){ 


$(this).parent().fadeOut('slow', function(c){ 

    /* 
     c is the event listener object 
     some peopele use e or event instead but it doesn't matter 

     you can prevent default actions of elements 
     like links or form submission buttons by using the event 
     listener object. 

     for example: 
     would stop the default action of an element 
     the div used doesn't have one so it will 
     create an error and return undefinded 
     c.preventDefault(); 

     another example: 
     This would stop the event from going up the document object 
     model to other elements 
     It's not necessary here though because you are using the 
     parent() function to select the parent div only 
     so this will also return an error of undefined 
     c.stopPropagation(); 
    */ 

     /* 
     this will display the event listener object it will be 
     undefined on the jquery function you are using 
     */ 
     //alert(c); 

    /* 
     A good use for the event listener would be to capture 
     capture keycodes of the keyboard presses display them or 
     do perform an action if a user presses a certain key like 
     up arrow for example 
    */ 

     //you could do something like this 
    $(window).on("keypress",function(event){ 

     //display the keycode pressed 
     //which is the property of the event object in this 
     //case 
     alert(event.which); 

    }); 

     }); 
     }); 
    }); 

下面是實施例HTML:

  <div class="parent"> 

        I am the parent content 

       <div class="alert-close"> 

        hello im the alert close div container, click on me 

       </div> 
     </div> 
相關問題