經過JS控制textarea的輸入長度

廢話很少說，直接上代碼(由於本身也只是遇到的時候而後上網查到的解決辦法，放在此處只是爲了方便各位看以及之後再碰到用起來方便)

<ul>
        <li>
            <textarea rows="5" cols="60" onpropertychange="if(value.length>50) value=value.substr(0,50)"></textarea><input
                type="button" value="onpropertychange"></input></li>
        <li>
            <hr />
        </li>
        <li>
            <textarea rows="5" cols="60" onchange="if(value.length>50) value=value.substr(0,50)"></textarea><input
                type="button" value="onchange"></input></li>
        <li>
            <hr />
        </li>
        <li>
            <textarea rows="5" cols="60" onkeydown="if(value.length>50) value=value.substr(0,50)"></textarea><input
                type="button" value="onkeydown"></input></li>
        <li>
            <hr />
        </li>
        <li>
            <textarea rows="5" cols="60" onkeyup="if(value.length>50) value=value.substr(0,50)"></textarea><input
                type="button" value="onkeyup"></input></li>
        <li>
            <hr />
        </li>
        <li>
            <textarea rows="5" cols="60" onkeypress="if(value.length>50) value=value.substr(0,50)"></textarea><input
                type="button" value="onkeypress"></input></li>
    </ul>

上面幾個方法均可以實現控制textarea的長度，可是隻有[onpropertychange]是最理想的方法：

onpropertychange：不解釋，我的認爲是最好的相似於maxlength屬性

onchange：此屬性也能夠實現，可是效果是輸入完以後，鼠標離開textarea后里面的值纔會變成限制的長度。

onkeydown和onkeypress：

一直不太理解onkeydown和onkeypress區別有多大，上面的兩個方法當長度達到限制後，若是再輸入的值與textarea內容最後一個字符值不同，後改變最後一個字符的值爲當前輸入的值。

onkeyup：顧名思義，是當鍵盤按鍵彈起以後，輸入的內容只要按鍵沒有彈起能夠一直輸入，可是彈起以後就會截取輸入的內容。

最後：後三種沒法解決粘貼的問題。原本想放個什麼能夠直接在此頁面上運行的工具，但是還不太會，各位將就看看吧。

 

最後的最後：求大神告訴我怎麼在博客裏用Jsfiddle或者其餘的工具。