一般來說，react上我們都會用change事件去處理input的輸入，但這樣就導致乙個問題，在輸入中文的時候，我們還沒輸入完成就會觸發change事件，這樣顯然不是理想狀況。
那麼，怎麼解決這個問題呢？首先，你需要了解3個事件，compositionstart，compositionupdate和compositionend。什麼意思呢？
compositionstart
要開始輸入中文
compositionupdate
插入新字元
compositionend
輸入完成
下面是一段**，可以copy感受一下
constructor(props)
compositionstart(event)
compositionupdate(event)
compositionend(event)
changeevent()
render()
}window.onload = function ()
需要注意的是，要引入react和babel
然後，看一下效果
可以看到，我們再輸入中文的過程中，event.data為輸入的英文值，並且連英文本元之間的分隔符也有，這樣就導致一些問題，比如我們的input不允許輸入特殊字元，這樣我們如果用onchange去處理的話，顯然不行。所以我們要想辦法，在中文輸入完成之後，再處理onchange事件。
明白這幾個事件之後，怎麼辦呢？看這裡
var isoncomposition = true;
constructor(props)
handlecomposition(e) else
}changeevent()
}render()
}window.onload = function ()
而在chrome瀏覽器中，change方法會先於compositionend事件執行，這樣的話，我們的change在執行時，isoncomposition永遠都是true。
怎麼辦呢？就是在compositionend中加乙個判斷!isoncomposition && ischrome，當chrome瀏覽器時，會在compositionend結束，執行change的方法。
**如下
var isoncomposition = false;
const ischrome = !!window.chrome && !!window.chrome.webstore
constructor(props)
handlecomposition(e)
} else
}changeevent()
}render()
}window.onload = function ()
輸入框輸入限制
public class verifytext 主監聽 regexpverifylistener regexpverifylistener null regexpverifylistener regexpverifylistener this.text.getdata digitverifylist...
輸入框輸入金額
用法 第一種 inputfilter filters edshopprice.setfilters filters edmarketprice.setfilters filters 第二種 edshopprice.setfilters new inputfilter edmarketprice.se...
輸入框只能輸入數字
正規表示式限制輸入框只能輸入數字 如下 其中，onafterpaste防止使用者從其它地方copy內容貼上到輸入框 輸入框只能輸入字母和下橫線的正規表示式 輸入框只能輸入字母數字和下橫線的正規表示式 或 as3 文字過濾 過濾文字輸入 textfield.restrict 此處為可輸入的內容 fie...