通过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或者其他的工具。