如何禁止textarea输入的方法
墨初 Web前端 2560阅读
在用户提交的html表单中,可能由于某些需求需要对textarea输入框做禁止输入的处理。禁止textarea输入有多种方法,比如直接html的元素属性,CSS样式,js脚本等。下面的博文就详细的介绍一下。
禁止textarea输入的方法
1、通过html属性禁止textarea输入
1)、readonly:此属性只可读取与复制,但不能修改内容
<textarea readonly="readonly"></textarea>
2)、disabled:此属性只可读取,但不可复制与修改内容
<!-- 73so.com --> <textarea disabled="disabled"></textarea>
3)、placeholder:此属性只做为提示使用,用户输入内容后会自动隐藏。
<textarea placeholder="请输入您的意见"></textarea>
2、使用css禁止textarea输入
可以使用CSS中的pointer-events属性来禁止textarea来输入。
<style> .t{ pointer-events:none; width: 200px; height: 150px; } </style> <textarea class="t"></textarea>
3、js禁止textarea输入
除了上面所说的通过html属性与css属性来禁止textarea输入外,还可以使用js脚本来禁止输入。
例:
<textarea id="myTextarea"></textarea> <script> var textarea = document.getElementById("myTextarea"); textarea.onkeydown = function(event) { event.returnValue = false; } </script>
以上就是关于禁止textarea输入的方法,当然上面提供的方法只是在前端做的设置,为了安全考虑在数据提交做最好在后台也做一次数据校验。