Question

我定义了Textarea自动高度。如果在textarea auto height上键入的数据将正常工作。我在浏览器中存储了localstorage。刷新页面高度时将更改为正常高度，文本将被隐藏。刷新页面时我需要相同的高度。请指导我。提前致谢。抱歉英语不好。

＆＃13;

  function saveEdits1() {
    var editElem = document.getElementById("post_title");
    var userVersion1 = editElem.value;
    sessionStorage.userEdits1 = userVersion1;
  }
  
  function checkEdits() {
    if( sessionStorage.userEdits1!=null){
    document.getElementById("post_title").value = sessionStorage.userEdits1;
    }
}
     function textAreaAdjust(txt) {
            txt.style.height = "10px";
            txt.style.height = (25+txt.scrollHeight)+"px";
        }

＆＃13;

<body onload="checkEdits()">  
           <div class="container"> 
                <div class="cont_group1"> 
                  <div class="form-group">  
                       <textarea cols="33" onkeydown="textAreaAdjust(this)" style="overflow:hidden"  name="post_title" id="post_title" onblur="saveEdits1()" class="form-control"></textarea>
                  </div>  
                </div>
             </div>
             </body>

＆＃13;

Answer 1

制作假事件以触发textarea中的关键事件。

＆＃13;

        function saveEdits1() {
          var editElem = document.getElementById("post_title");
          var userVersion1 = editElem.value;
          sessionStorage.userEdits1 = userVersion1;
        }

        function checkEdits() {
          if (sessionStorage.userEdits1 != null) {
		    document.getElementById("post_title").value = sessionStorage.userEdits1;            
            
            var ev = new Event("keypress", {"bubbles":true, "cancelable":false});
            var el = document.getElementById("post_title");
                el.addEventListener("keypress",textAreaAdjust(el));
                el.dispatchEvent(ev)
          }
        }
        function textAreaAdjust(txt) {
          txt.style.height = "10px";
          txt.style.height = (25 + txt.scrollHeight) + "px";
        }

＆＃13;

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Starfleet</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    
    
</head>
<body onload="checkEdits()">
  <div class="container"> 
    <div class="cont_group1"> 
      <div class="form-group">  
        <textarea cols="33" onkeydown="textAreaAdjust(this)" style="overflow:hidden"  name="post_title" id="post_title" onblur="saveEdits1()" class="form-control"></textarea>
      </div>  
    </div>
  </div>
</body>

</html>

＆＃13;

Textarea自动高度，在页面上刷新时保持相同的高度

1 个答案: