[英]Internet Explorer 10, auto resize textarea
看起來這個問題似乎已經回答了一千次,但我發現的解決方案既沒有在Internet Explorer 10中工作,也沒有在Windows-phone 8上工作(對我來說更重要)。
我的一般問題是:我正在編寫一個Windows-Phone-8,C#應用程序,用戶應編輯相當大量的文本。 由於每個UIElement限制為2048像素,我不能使用TextBox。 所以我想讓用戶在Webbrowser控件中的textarea
中編輯文本。 為此,textarea必須使用輸入/刪除的文本調整大小。
我嘗試了這些主題中的每個答案:
但我沒有讓它在Internet Explorer 10中工作。
我會很感激任何完全正常工作的HTML,因為我以前從未使用過html和JavaScript,或者是讓用戶編輯大量文本的其他解決方案。
我不確定這是否適合你,但嘗試jQuery Autosize: http : //www.jacklmoore.com/autosize/ (。)我不確定你是否可以在你的應用程序中使用它,但我以前在我自己的項目中使用它,發現它運行得很好。
超輕重量:
有沒有人認為滿足? 沒有搞亂滾動,我喜歡它的唯一JS就是你打算在模糊上保存數據......顯然,它在所有流行的瀏覽器上兼容: http : //caniuse.com/#feat= CONTENTEDITABLE
只需將其設置為文本框樣式,然后自動調整...使其最小高度和行高成為首選文本高度並具有此功能。
這種方法的優點在於您可以在某些瀏覽器上保存和標記。
http://jsfiddle.net/gbutiri/v31o8xfo/
<style>
.autoheight {
min-height: 16px;
font-size: 16px;
margin: 0;
padding: 10px;
font-family: Arial;
line-height: 16px;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
overflow: hidden;
resize: none;
border: 1px solid #ccc;
outline: none;
width: 200px;
}
</style>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script>
$(document).on('blur','.autoheight',function(e) {
var $this = $(this);
// The text is here. Do whatever you want with it.
console.log($this.html());
});
</script>
<div class="autoheight contenteditable" contenteditable="true">Mickey <b>Mouse</b></div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.