input框輸入實時觸發

有時候需要校驗input框的值，比如說郵箱電話之類的正則校驗，onblur事件是失去焦點的時候才觸發，不夠實時，input事件是馬上觸發，比如下面這種情況，如果輸入中文的話，這個時候不應該觸發的，但是實際上已經校驗了5次了，也太靈敏了，如果在js裏面有調用後臺方法的話就會頻繁觸發後臺請求，我們希望輸入完中文之後才觸發校驗

$('#email').on('input',function () {
	console.info("開始校驗");
});

下面介紹兩個監聽中文輸入法的事件
compositionstart
是指中文輸入法開始輸入觸發，每次輸入開始僅執行一次
compositionend
是指中文輸入法輸入完成時觸發，這時得到的結果就是最終輸入完成的結果，此事件僅執行一次。

這兩個事件比較特殊，只監聽中文輸入法，如果輸入是數字或者是英文輸入法的時候它是不觸發的。這個時候我們可以把這兩個事件跟input事件組合使用

	var flag = true;
    $('#email').on('compositionstart',function(){
        flag = false;
    });
    $('#email').on('compositionend',function(){
        flag = true;
		console.info("中文輸入完成校驗");//業務邏輯處理
    });
    $('#email').on('input',function(){
        if(flag){
          console.info("校驗。。。");//業務邏輯處理
        }

    });

假如第一次輸入中文，輸入完成後觸發校驗一次，接下來正常輸入英文，這時候起作用的是input。這樣就可以完美實現實時校驗了。