Javascript - 如何在代碼中設置高度時手動減少Chrome中的textarea高度？

我有一個用戶經常使用的形式的textarea。當用戶使用textarea右下角的resize事件手動調整textarea的大小時，我將高度保存爲localStorage。我想將textarea高度設置爲保存在localStorage中的高度，但是當我這樣做時，textarea的大小不能小於設置的高度。Javascript - 如何在代碼中設置高度時手動減少Chrome中的textarea高度？

它在Firefox中正常工作，但在Chrome中無法正常工作。

我目前正在使用jQuery的.height（）設置高度。我也試過.outerHeight（），.css（），.style，.setProperty（）。沒有工作。

代碼我的工作：

id = params.id ? params.id : $el.attr('id'); 
    lsHeight = localStorage.getItem('textareaOuterHeight-' + id); 

    if (lsHeight != null) { 
     $el.height(lsHeight); 
    } 

    $el.data('defaultOuterHeight', $el.outerHeight()); 

    $el.on('click', function() { 
     if ($el.data('defaultOuterHeight') !== $el.outerHeight()) { 
     localStorage.setItem('textareaOuterHeight-' + id, $el.outerHeight()); 
     } 
    });

來源

2017-01-09 NeedsHelp

看看你能提供一些你使用的代碼嗎？ –

@IuriiDrozdov代碼已添加。 – NeedsHelp

請看看https://jsfiddle.net/pL4shps0/ –

這似乎爲我正常工作：相反

$('textarea').height(20);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> 
 
<textarea name="" id="" cols="50" rows="50"></textarea>

節能+修改文本區域與高度CSS的高度值，可以嘗試修改列數或行數：

$('textarea').attr('rows',60);

來源

2017-01-09 12:48:31 Alvaro

我試過這個，但通過拖動它的右下角來增加textarea的大小似乎並沒有增加行數。除非我錯過了什麼？ – NeedsHelp

@NeedsHelp你是對的，它改變了高度和寬度。我的建議需要弄清楚如何調整高度以保存行數。如果你沒有找到實際應用高度的方法。 – Alvaro

這是Chrome的錯誤，這仍然是開放的https://bugs.chromium.org/p/chromium/issues/detail?id=94583

可以使用的解決方法從這裏jsfiddle.net/nz8ut/2/

而且你可以在這個問題Custom CSS to allow chrome textarea resize smaller than initial state?

來源

2017-01-09 15:55:54

Javascript - 如何在代碼中設置高度時手動減少Chrome中的textarea高度？

回答

相關問題