尝试这个：

$(document).ready(

  function() {

    $("textarea").addClass("-real-textarea");

    $(".textarea-wrapper").append("<textarea class=\"hidden\"></textarea>");

    $(".textarea-wrapper textarea.hidden").keyup(

      function() {

        $(".textarea-wrapper textarea.-real-textarea").val($(this).val());

      }

    );

    $(".textarea-wrapper textarea.-real-textarea").focus(

      function() {

        $(this).parent().find("textarea.hidden").focus();

      }

    );

  }

);


.textarea-wrapper {

  position: relative;

}



.textarea-wrapper textarea {

  background-color: white;

}



.textarea-wrapper,

.textarea-wrapper textarea {

  width: 500px;

  height: 500px;

}



.textarea-wrapper textarea.hidden {

  color: white;

  opacity: 0.00;

  filter: alpha(opacity=00);

  position: absolute;

  top: 0px;

  left: 0px;

}


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<div class="textarea-wrapper">

  <textarea></textarea>

</div>

这个想法是<textarea>在真实的对象上方/上方创建第二个不可见的对象。用户正在键入不可见的内容，但由于不可见，因此文本（也不显示插入符号/光标）不出现！然后，您可以使用JavaScript将其值分配给可见的值。

但这似乎在IE8中不起作用：’（即使不透明度提高到11，插入符号仍然可见。

但是它可以在Firefox中使用…？