textarea不能选中及定位 鼠标问题

来源:互联网 发布:js数组remove和push 编辑:程序博客网 时间:2024/06/05 03:26

    近日在做一个项目,由于UED时间紧,所以有些小东西就只能自己写CSS控制了。没想到一个小小CSS的改动,居然会引起“textarea不能选中及定位 鼠标问题”。过程是这样子的:如果用户输入的字符不对或者超出长度,那么会有一个提示的span。这个span是一直存在的,只是通过html展示给用户的可见与不可见。如果用户输入的字符没有超出长度,那么textarea是能选中及定位鼠标到某个具体的字符。但是一旦点击了确定,验证之后,textarea就像宕机一样,怎么也没有反应。经过漫长的排查,原来是padding惹的祸。

  <textarea class="textarea400" id="templateContent">
      第一夫人首领定制风潮
    广州物流中心自提点搬迁公告!
    生活图书每满100减20!
    商务休闲衬衫低至45元
    休食专场低至19.9元
    美体瘦身专场低至68元!
    京东手机武林群英谱!
   </textarea>
 <span class="errorTip" id="replyContentTip" style="padding:60px;"></span>

这样一旦用户输入错误或者超长时,span就会被填充字符。由于padding太高,所以span占用了textarea的位置。这样你每次是用鼠标去点击textarea框的话,实际是响应span,所以才会不能选中。

呃。。。真坑爹。

原创粉丝点击