[jQuery學習系列四 ]4-Jquery學習四-事件操做

時間 2020-10-26

標籤 css html jquery 編程瀏覽器微信 app 框架 dom ide 欄目 JQuery 简体版

原文原文鏈接

[jQuery學習系列四 ]4-Jquery學習四-事件操做

前言:
今天看知乎偶然看到中國有哪些相似於TED的節目, 回答中的一些推薦我給記錄下來了, 順便也在這裏貼一下: 一席雲集聽道推酷青年中國說 SELF格致論道css

參考：http://www.365mini.com/page/tag/jquery-event-methods

html

1,ready
ready()函數用於在當前文檔結構載入完畢後當即執行指定的函數。
該函數的做用至關於window.onload事件。jquery

2,blind
bind()函數用於爲每一個匹配元素的一個或多個事件綁定事件處理函數。
舉例：編程

<div id="n1">
    <p id="n2"><span>CodePlayer</span></p>
    <p id="n3"><span>專一於編程開發技術分享</span></p>
    <em id="n4">http://www.365mini.com</em></div>
<p id="n5">Google</p>var obj = { id: 5, name: "王五" };//爲div中的全部p元素的click事件綁定事件處理函數//只有n二、n3能夠觸發該事件$("div p").bind("click", function(){// 這裏的this指向觸發點擊事件的p元素(Element)
    alert( $(this).text() );
});// 新添加的n6不會觸發上述click事件$("#n1").append('<p id="n6">上述綁定的click事件不會對該元素也生效!</p>');//爲n5綁定mouseenter mouseleave兩個事件，併爲其傳入附加數據obj// 附加數據能夠是任意類型$("#n5").bind("mouseenter mouseleave", obj, function(event){    var $me = $(this);    var obj = event.data; // 這就是傳入的附加數據
    if( event.type == "mouseenter"){
        $me.html( "你好，" + obj.name + "!");
    }else if(event.type == "mouseleave" ){
        $me.html( "再見，" + obj.name + "!");      
    }           
} );

此外，若是符合條件的元素是bind()函數執行後新添加的，綁定事件不會對其生效。一樣以初始HTML代碼爲例，咱們能夠編寫以下jQuery代碼：
bind()函數的參數eventsMap是一個對象，能夠"屬性-值"的方式指定多個"事件類型-處理函數"。對應的示例代碼以下：瀏覽器

var eventsMap = {    "mouseenter": function(event){
        $(this).html( "Hello!");        
    },    
    "mouseleave": function(event){
        $(this).html( "Bye!");
    }
};//爲n5綁定mouseenter mouseleave兩個事件$("#n5").bind( eventsMap );

3,unbind
unbind()函數用於移除匹配元素上綁定的一個或多個事件的事件處理函數。
unbind()函數主要用於解除由bind()函數綁定的事件處理函數。微信

$buttons.unbind("click"); //移除全部button上click事件$("#btn1").unbind("click");//移除某個button上click事件

4,live
live()函數用於爲指定元素的一個或多個事件綁定事件處理函數。
即便是執行live()函數以後新添加的元素，只要它匹配當前jQuery對象的選擇器，綁定的事件處理函數仍然對其有效。
要刪除經過live()綁定的事件，請使用die()函數。app

jQuery 1.3 新增該函數，從jQuery 1.7開始被標記爲已過期，在jQuery 1.9中被移除,請使用on()函數來替代。請使用on()函數來替代。

框架

5，die
同上。1.9 已經被移除。dom

6,delegate
delegate()函數用於爲指定元素的一個或多個事件綁定事件處理函數。
即便是執行delegate()函數以後新添加的元素，只要它符合條件，綁定的事件處理函數仍然對其有效。
要刪除經過delegate()綁定的事件，請使用undelegate()函數。
jQueryObject.delegate( selector , events [, data ], handler )
jQueryObject.delegate( selector, eventsMap )
舉例：ide

<div id="n1">
    <p id="n2"><span>CodePlayer</span></p>
    <p id="n3"><span>專一於編程開發技術分享</span></p>
    <em id="n4">http://www.365mini.com</em></div>
<p id="n5">Google</p>var data = { id: 5, name: "李四" };//爲n5綁定mouseenter mouseleave兩個事件，併爲其傳入附加數據data//附加數據能夠是任意類型$("body").delegate("#n5", "mouseenter mouseleave", data, function(event){    var $me = $(this);    var options = event.data; // 這就是傳入的附加數據
    if( event.type == "mouseenter"){
        $me.html( "你好，" + options.name + "!");
    }else if(event.type == "mouseleave" ){
        $me.html( "再見，" + options.name + "!");      
    }           
} );

delegate()函數的參數eventsMap是一個對象，能夠"屬性-值"的方式指定多個"事件類型-處理函數"。對應的示例代碼以下：

var events = {    "mouseenter": function(event){
        $(this).html( "你好!");       
    },    "mouseleave": function(event){
        $(this).html( "再見!");
    }
};//爲n5綁定mouseenter mouseleave兩個事件，併爲其傳入附加數據data$("body").delegate("#n5", events);

7,undelegate
jQueryObject.undelegate( [ selector , events [, handler ]] )
jQueryObject.undelegate( selector , eventsMap )

8,on
on()函數用於爲指定元素的一個或多個事件綁定事件處理函數。
從jQuery 1.7開始，on()函數提供了綁定事件處理程序所需的全部功能，用於統一取代之前的bind()、 delegate()、 live()等事件函數。
即便是執行on()函數以後新添加的元素，只要它符合條件，綁定的事件處理函數也對其有效。
要刪除經過on()綁定的事件，請使用off()函數。若是要附加一個事件，只執行一次，而後刪除本身，請使用one()函數。
用法一：
jQueryObject.on( events [, selector ] [, data ], handler )
用法二：
jQueryObject.on( eventsMap [, selector ] [, data ] )

示例&說明：
以點擊事件("click")爲例，如下是jQuery中事件函數的常規用法(某些函數也存在其它形式的用法，此處暫不列出)：
// 這裏的選擇器selector用於指定能夠觸發事件的元素
// 這裏的選擇器ancestor應是selector的祖輩元素，selector觸發的事件能夠被其祖輩元素在事件流中捕獲，從而以"代理"的形式觸發事件。

// jQuery 1.0+ (1.4.3+支持參數data)
$("selector").click( [ data ,] handler );

// jQuery 1.0+ (1.4.3+支持參數data)
$("selector").bind( "click" [, data ], handler );

// jQuery 1.3+ (1.4+支持參數data)
$("selector").live( "click" [, data ], handler );

// jQuery 1.4.2+
$("ancestor").delegate( "selector", "click" [, data ], handler );

// jQuery 1.7+
$("ancestor").on( "click", "selector" [, data ], handler );

請參考下面這段初始HTML代碼：

<div id="n1">
    <p id="n2"><span>CodePlayer</span></p>
    <p id="n3"><span>專一於編程開發技術分享</span></p>
    <em id="n4">http://www.cnblogs.com/wang-meng/</em></div>
<p id="n5">Google</p>

咱們爲<div>中的全部<p>元素綁定點擊事件：

// 爲div中的全部p元素綁定click事件處理程序// 只有n二、n3能夠觸發該事件$("div").on("click", "p", function(){    // 這裏的this指向觸發點擊事件的p元素(Element)
    alert( $(this).text() );
});

若是要綁定全部的<p>元素，你能夠編寫以下jQuery代碼：

//爲全部p元素綁定click事件處理程序(注意：這裏省略了selector參數)//n二、n三、n5都可觸發該事件$("p").on("click", function(event){// 這裏的this指向觸發點擊事件的p元素(Element)
    alert( $(this).text() );
});

此外，咱們還能夠同時綁定多個事件，併爲事件處理函數傳遞一些附加的數據，咱們能夠經過jQuery爲事件處理函數傳入的參數event(Event事件對象)來進行處理：

var data = { id: 5, name: "張三" };// 爲n5綁定mouseenter mouseleave兩個事件，併爲其傳入附加數據data// 附加數據能夠是任意類型$("body").on("mouseenter mouseleave", "#n5", data, function(event){    var $me = $(this);    var options = event.data; // 這就是傳入的附加數據
    if( event.type == "mouseenter"){
        $me.html( "你好，" + options.name + "!");      
    }else if(event.type == "mouseleave" ){
        $me.html( "再見!");       
    }           
});

此外，即便符合條件的元素是on()函數執行後新添加，綁定事件對其依然有效。一樣以初始HTML代碼爲例，咱們能夠編寫以下jQuery代碼：

// 爲div中的全部p元素綁定click事件處理程序// 只有n二、n3能夠觸發該事件$("div").on("click", "p", function(event){
    alert( $(this).text() );
});// 後添加的n6也能夠觸發上述click事件，由於它也是div中的p元素$("#n1").append('<p id="n6">上述綁定的click事件對此元素也生效!</p>');

on()函數的參數eventsMap是一個對象，能夠"屬性-值"的方式指定多個"事件類型-處理函數"。對應的示例代碼以下：

var data = { id: 5, name: "張三" };var events = {    "mouseenter": function(event){
        $(this).html( "你好，" + event.data.name + "!");       
    },    
    "mouseleave": function(event){
        $(this).html( "再見!");
    }       
};//爲n5綁定mouseenter mouseleave兩個事件，併爲其傳入附加數據data$("body").on(events, "#n5", data);

9,off
off()函數用於移除元素上綁定的一個或多個事件的事件處理函數。
off()函數主要用於解除由on()函數綁定的事件處理函數。

10,one
one()函數用於爲每一個匹配元素的一個或多個事件綁定一次性事件處理函數。
要刪除經過one()綁定的事件，請使用unbind()或off()函數。

舉例說明：

<input id="btn" type="button" value="點擊" />
<div id="n1">
    <p id="n2">段落文本內容1</p>
    <p id="n3">段落文本內容2</p>
    <span id="n4">隱藏關卡</span>
</div>
<div id="n5">
    <p id="n6">段落文本內容3</p>
    <p id="n7">段落文本內容4</p>
</div>
<p id="n8">專一於編程開發技術分享</p>

咱們爲上述HTML中的按鈕綁定一次性的click事件：

// 只有第一次點擊時，執行該事件處理函數// 執行後one()會當即移除綁定的事件處理函數$("#btn").one("click", function(){
    alert("只彈出一次提示框!");     
});

var obj = { id: 5, name: "張三" , hidden : 20};// 只有第一次點擊時，執行該事件處理函數// 執行後one()會當即移除綁定的事件處理函數$("#btn").one("click", function(){
    alert("只彈出一次提示框!");     
});

$("#n4").one("mouseenter mouseleave", obj, function(event){    var obj = event.data;    var $me = $(this);    if(event.type == "mouseenter"){
        $me.html( obj.name + '，你碰到了隱藏關卡，得到' + obj.hidden + "金幣!" );     
    }else{
        $me.html( '你已經過該關卡!' );     
    }
        
});

11,trigger
trigger()函數用於在每一個匹配元素上觸發指定類型的事件。
使用該函數能夠手動觸發執行元素上綁定的事件處理函數，也會觸發執行該元素的默認行爲。
以表單元素<form>爲例，使用trigger("submit")能夠觸發該表單綁定的submit事件，也會執行表單submit事件的默認行爲——表單提交操做。
可是連接標籤<a>的trigger("click")是一個特例，不會觸發連接click事件的默認行爲——跳轉到對應連接的操做

舉例：

<input id="btn1" type="button" value="點擊1" />
<input id="btn2" type="button" value="點擊2" />
<a id="a1" href="#">CodePlayer</a>
<div id="log"></div>var $log = $("#log");

function handler( event, arg1, arg2 ){    var html = '<br>觸發元素#' + this.id + '的[' + event.type +']事件，額外的函數參數爲:' + arg1 + ', ' + arg2;
    $log.append( html );
}var $buttons = $(":button");// 爲全部button元素的click事件綁定事件處理函數$buttons.bind( "click", handler );// 爲全部a元素的click、mouseover、mouseleave事件綁定事件處理函數$("a").bind( "click mouseover mouseleave", handler );// 觸發全部button的click事件$buttons.trigger("click"); 
/*(追加文本)
觸發元素#btn1的[click]事件，額外的函數參數爲:undefined, undefined
觸發元素#btn2的[click]事件，額外的函數參數爲:undefined, undefined*/$("#btn1").trigger("click", "CodePlayer");/*(追加文本)
觸發元素#btn1的[click]事件，額外的函數參數爲:CodePlayer, undefined*/// arg1 = "張三"， arg2 = 20$("a").trigger("mouseover", ["張三", 20 ] );/*(追加文本)
觸發元素#a1的[mouseover]事件，額外的函數參數爲:張三, 20*/$("a").trigger("mouseleave", { name: "張三", age: 18 } );/*(追加文本)
觸發元素#a1的[mouseleave]事件，額外的函數參數爲:[object Object], undefined*/

運行結果圖：

12,triggerHandler
triggerHandler()函數用於在每一個匹配元素上觸發指定類型的事件。
該函數的做用於trigger()函數類似，但triggerHandler()函數具備如下例外狀況：
1-triggerHandler()不會觸發執行元素的默認行爲(例如連接click事件默認的跳轉行爲，表單submit事件默認的提交行爲)。
2-triggerHandler()觸發事件只針對jQuery對象中的第一個匹配元素。
3-triggerHandler()觸發的事件不會在DOM樹中冒泡，所以事件不會冒泡傳遞到它的任何祖輩元素。
4-triggerHandler()的返回值是對應事件處理函數的返回值，而不是當前jQuery對象自己。

還拿上面的html代碼爲例子：

var $buttons = $(":button");// 爲全部button元素的click事件綁定事件處理函數$buttons.bind( "click", handler );// 觸發btn1的click事件// 雖然$buttons匹配兩個button元素，但只會觸發第一個匹配元素的click事件$buttons.triggerHandler("click");/*(追加文本)
觸發元素#btn1的[click]事件，額外的函數參數爲:undefined, undefined*/

13,load
jQuery 1.0 新增該函數，但從1.8開始被標記爲已過期。
這裏介紹的load()是一個事件函數，jQuery中還有一個同名的Ajax函數load()，用於經過Ajax加載html文檔內容。

14，unload
同上，jQuery 1.0 新增該函數，但從1.8開始被標記爲已過期。

15，resize
resize()函數用於爲每一個匹配元素的resize事件綁定處理函數。該函數也可用於觸發resize事件。此外，你還能夠額外傳遞給事件處理函數一些數據。
resize事件會在元素的尺寸大小被調整時觸發。該事件經常使用於window對象(瀏覽器窗口)或框架頁面。
此外，你能夠爲同一元素屢次調用該函數，從而綁定多個事件處理函數。觸發resize事件時，jQuery會按照綁定的前後順序依次執行綁定的事件處理函數。
要刪除經過resize()綁定的事件，請使用unbind()函數。

實例：
如今，咱們爲window對象的resize事件綁定處理函數(能夠綁定多個，觸發時按照綁定順序依次執行)：

$(window).resize( function(){
    alert("不建議調整窗口大小!");
} );// 觸發window對象的resize事件$(window).resize( );

咱們還能夠爲事件處理函數傳遞一些附加的數據。此外，經過jQuery爲事件處理函數傳入的參數Event對象，咱們能夠獲取當前事件的相關信息(好比事件類型、觸發事件的DOM元素、附加數據等)：

var minSize = { width: 800, height: 600 };

$(window).resize( minSize, function(event){    var min = event.data;    var $dom = $(this);    if( $dom.width() < min.width ){
        $("body").append("<br>窗口寬度不要小於" + min.width );
    }else if( $dom.height() < min.height ){
        $("body").append("<br>窗口高度不要小於" + min.height);
    }
} );

16，scroll
scroll事件會在元素的滾動條位置發生改變時觸發。該事件通常僅適用於window對象或其餘可滾動元素(通常會出現滾動條)。

<div id="msg" style="height: 3000px;" ></div>$(window).scroll( function(event){
    $("#msg").append( $(this).scrollTop() + '<br>' );
} );// 觸發window對象的scroll事件//$(window).scroll( );

17，focus
focus事件就是得到鼠標光標焦點事件。

<input id="t1" name="name" type="text" /><span class="tips"></span>
<br>
<input id="t2" name="age" type="text" /><span class="tips"></span>var $texts = $(":text");//爲全部text元素的focus事件綁定處理函數$texts.focus( function(event){
    $(this).css("border", "1px solid blue");
} );// 爲全部text元素的focus事件綁定處理函數//border-radius 屬性是一個簡寫屬性，用於設置四個 border-*-radius 屬性。//該屬性容許您爲元素添加圓角邊框！$texts.focus( function(event){
    $(this).css("border-radius", "3px");
} );var inputMap = { "name": "姓名", "age": "年齡" };// 爲全部text元素的focus事件綁定處理函數$(":text").focus( inputMap, function(event){    var map = event.data;
    $(this).next(".tips").html( '請輸入[' + map[this.name] + ']' );
} );

18，blur
blur事件就是得到失去鼠標光標焦點事件
注意：
並非全部元素均可以失去焦點，能夠得到鼠標光標焦點的元素主要是表單輸入元素(只有得到焦點後纔可能失去焦點)。

實例：

<input id="t1" name="name" type="text" /><span class="tips"></span>
<br>
<input id="t2" name="age" type="text" /><span class="tips"></span>var $texts = $(":text");//爲全部text元素的blur事件綁定處理函數$texts.blur( function(event){
    $(this).css("border", "1px solid blue");
} );// 爲全部text元素的blur事件綁定處理函數$texts.blur( function(event){
    $(this).css("border-radius", "3px");
} );var inputMap = { "name": "姓名", "age": "年齡" };// 爲全部text元素的blur事件綁定處理函數// 文本框失去焦點時，進行表單驗證，並顯示相應的提示信息$(":text").blur( inputMap, function(event){    var map = event.data;    var $me = $(this);    var tips = '';    if( !$me.val() ){
        tips = '<span style="color:red;">[' + map[this.name] + ']不能爲空!</span>';
    }
    $(this).next(".tips").html( tips );
} );

19，focusin
focusin事件就是得到焦點事件。與focus事件不一樣的是：focusin能夠檢測該元素的後代元素得到焦點的狀況(換句話說，focusin事件支持冒泡)。

示例 & 說明
Html代碼：

<p>
    <input id="t1" name="name" type="text" />
</p>
<p>
    <input id="t2" name="age" type="text" />
</p>
<div id="msg"></div>

如今，咱們爲全部p元素的focusin事件綁定處理函數(能夠綁定多個，觸發時按照綁定順序依次執行)：
focusin是支持冒泡的，當咱們把鼠標光標放入文本框時，該事件冒泡傳遞到父元素p上，所以能夠在p元素上觸發focusin事件。

var $ps = $("p");//爲全部p元素的focusin事件綁定處理函數$ps.focusin( function(event){
　　$(this).css("border", "1px solid blue");
} );//爲全部p元素的focusin事件綁定處理函數$ps.focusin( function(event){
　　$(this).css("border-radius", "3px");
} );//觸發全部p元素的focusin事件//$ps.focusin( ); // 調用不帶任何參數的focusin()函數，會觸發每一個匹配元素的focusin事件

20，focusout
focusout事件就是失去焦點事件。與blur事件不一樣的是：focusout能夠檢測該元素的後代元素得到焦點的狀況(換句話說，focusout事件支持冒泡，blur不支持)。
效果同上。

21，change
change事件會在文本內容或選項被更改時觸發。該事件僅適用於<input type="text">和<textarea>以及<select>。對於text和textarea元素，該事件會在元素失去焦點時發生(文本內容也發生了更改)。

<input id="name" name="name" type="text" value="CodePlayer" />
<input id="age" name="age" type="text" value="20" />
<select id="gender" name="gender">
    <option value="男">男性</option>
    <option value="女">女性</option>
</select>
<div id="msg">姓名：[<label for="name">CodePlayer</label>]，年齡：[<label for="age">20</label>]歲，性別：[<label for="gender">男</label>]</div>
<br/>
<label for="SSN">Social Security Number:</label>  
<input type="text" name="SocSecNum" id="SSn" />  
<br/>  

<label>Date of Birth: <input type="text" name="DofB" /></label>  function handler(event){
    $("label[for='" + this.name + "']").html( this.value );    
}

$(":text").change( handler );
$("#gender").change( handler );

注意：這裏label 的用法是用戶點擊文字就須要將光標聚焦到對應的表單上面。

22，select
select事件會在文本框中的文本內容被選中時觸發。該事件僅適用於<input type="text">和<textarea>文本框。

<input id="t1" name="name" type="text" value="請選中這裏的所有或部份內容" />
<input id="t2" name="age" type="text" value="請選中這裏的所有或部份內容" />var $texts = $(":text");//爲全部text元素的select事件綁定處理函數$texts.select( function(event){
    $(this).css("border", "1px solid blue");
} );// 爲全部text元素的select事件綁定處理函數$texts.select( function(event){
    $(this).css("border-radius", "3px");
} );

23，submit
submit事件會在表單被提交時觸發。該事件僅適用於<form>元素。

<form id="myForm" action="http://www.baidu.com" method="post">
    <input id="name" name="name" type="text" value="CodePlayer" /><br>
    <input id="age" name="age" type="text" value="" /><br>
    <input type="submit" value="提交" />
</form>
<div id="msg"></div>$("form").submit( function(event){    if( !$("#name").val() ){
        alert("姓名不能爲空!");        return false; // 返回值爲false，將阻止表單提交
    }else if( !$("#age").val() ){
        alert("年齡不能爲空!");        return false; // 返回值爲false，將阻止表單提交    }
} );

24，keydown
25，keypress
26，keyup
keydown事件會在按下鍵盤按鍵時觸發。
它與keypress事件相似，但keypress着重的是按下該鍵輸入了哪一個字符(只有可以打印字符的鍵纔會觸發keypress)
keydown着重的是按下了哪一個鍵(按下任何鍵均可觸發keydown)。
對於諸如Ctrl、Alt、Shift、Delete、Esc等修飾性和非打印鍵，請監聽keydown事件。

keyup事件會在按下鍵盤按鍵並釋放時觸發。
例如：你一直按住A鍵，直到10秒鐘後才釋放，只會在釋放按鍵的時候觸發一次keyup事件。
但在這個過程當中會觸發許屢次keydown事件(或keypress事件)。所以，keyup事件沒法阻止字符的輸入。

27，click
28，dblclick
click事件就是鼠標按鈕單擊事件。
dblclick事件就是鼠標左鍵雙擊事件。

29，toggle
toggle()函數用於切換全部匹配的元素。
所謂"切換"，也就是若是元素當前是可見的，則將其隱藏；若是元素當前是隱藏的，則使其顯示(可見)。

示例：

<p>CodePlayer</p>
<p>Toggle 示例</p>切換效果：<select id="animation">
    <option value="1">toggle( )</option>
    <option value="2">toggle( "slow" )</option>
    <option value="3">toggle( 3000 )</option>
    <option value="4">toggle( 1000, complete )</option>
    <option value="5">toggle( 1000, "linear" )</option>
    <option value="6">toggle( options )</option>
    <option value="7">toggle( true )</option>
    <option value="8">toggle( false )</option>
</select>
<input id="btnSwitch" type="button" value="切換顯示/隱藏" >//【切換顯示/隱藏】按鈕$("#btnSwitch").click( function(){    var v = $("#animation").val();    if( v == "1" ){
        $("p").toggle( );        
    }else if(v == "2"){
        $("p").toggle( "slow" );    
    }else if(v == "3"){
        $("p").toggle( 3000 );    
    }else if(v == "4"){
        $("p").toggle( 1000, function(){
            alert("切換完畢!"); // 有兩個p標籤，會彈出兩次        } );
    }else if(v == "5"){
        $("p").toggle( 1000, "linear" );    
    }else if(v == "6"){
        $("p").toggle( { duration: 1000 } );    
    }else if(v == "7"){
        $("p").toggle( true ); // 至關於$("p").show();    
    }else if(v == "8"){
        $("p").toggle( false );     // 至關於$("p").hide();    }
} );

30，hover
hover事件就是鼠標懸停事件。

31，mouseenter
32，mouseover
mouseenter事件會在鼠標進入某個元素時觸發。
它與mouseover事件類似，但mouseenter事件只會在鼠標進入當前元素時觸發，而mouseover事件會在鼠標進入當前元素及其任何後代元素時觸發(換句話說，mouseover事件支持冒泡)。

33，mouseleave
34，mouseout
mouseout事件會在鼠標離開某個元素時觸發。
它與mouseleave事件類似，但mouseleave事件只會在鼠標離開當前元素時觸發，而mouseout事件會在鼠標離開當前元素及其任何後代元素時觸發(換句話說，mouseout事件支持冒泡)。

35，mousedown
36，mouseup
mousedown事件會在鼠標按鈕被按下時觸發。mouseup事件會在按下鼠標按鈕並釋放時觸發。
注意：若是一直按住鼠標按鈕不放，也只會觸發一次mousedown事件。

jQuery 事件就寫這麼多了，後面若是有新的內容仍會及時更新。

英語小貼士：

I've heard so much about you!
久仰大名。
I hope I'm not in the way.
我但願沒有形成妨礙。
It hurts like hell!
痛死了。
It's a pain in the neck.
那真是件麻煩事。
It's raining cats and dogs.
下着傾盆大雨。
It's up on the air.
懸而未決，還沒有肯定。
It slipped my mind.
我忘了。
I wasn't born yesterday.
我又不是三歲小孩。
I'll make it up to you.
我會賠償的。
I won't buy your story.
我不信你那一套。
In one ear, out the other.
一耳進，一耳出。
I'm spaced-out!
我開小差了！