Working jQuery Auto-Höhe Textfeld-Plugin?

Question

Kennt jemand ein tatsächliches, funktionierendes jQuery-Plugin, das die Höhe eines Textbereichs richtig erweitern kann, wenn ihm Text hinzugefügt wird?

Ich habe sowohl die autogrow und growfield Plugins ausprobiert und keiner scheint sehr gut zu funktionieren. Beide haben Probleme, wo sie nicht richtig wachsen und/oder ihre maximale Höhe manchmal ignorieren. Ich verwende FF 3.5 auf OSX zum Testen von FWIW.

Es gab ein drittes, das beim Googeln auftauchte, aber die Demo-Seite funktionierte nicht einmal, also habe ich es nicht ausprobiert.

Answer 1

I think this SA answer should help Nicht JQuery vollständig, aber der Code ist klein genug, um auf eigene Faust zu implementieren.

Answer 2

Bei der Arbeit an meinem aktuellen Projekt hatte ich ein ähnliches Problem, einfach kein solides, zuverlässig wachsendes Textbereich-Plugin zu finden. Am Ende habe ich mich auf growfield festgelegt, aber ich kann nicht sagen, dass ich zu glücklich damit bin.

Ein Problem, dass ich in der Lage zu adressieren war, war, dass growfield (zusätzlich zu fast jedem anderen Plugin) darauf bestand, eine zusätzliche Zeile im Textbereich zu jeder Zeit hinzuzufügen. Dies ist rau Entwicklungscode, und zur Zeit nur Adressen Safari und Firefox, aber hier ist einige Code, den ich bis zum Ende des growfield der getDummyHeight hinzugefügt() Funktion:

if ($.browser.safari) return h-sr.lh*2+sr.pt+sr.pb; 
if ($.browser.mozilla) return h-sr.lh*2+sr.pt*2+sr.pb+5; 

Es nutzt Browser-Erkennung (das ist eine schlechte Praxis), und ist wahrscheinlich abhängig von unserem Layout und CSS, aber Sie können vielleicht einige Optimierungen vornehmen, damit es in Ihrem Design gut funktioniert.

Falls Sie sich wundern (Growfield ist ein wenig kryptisch), bezieht sich h auf die Höhe der Textfläche, sr.lh bezieht sich auf die Zeilenhöhe, sr.pt bezieht sich auf die obere Füllung und sr.pb auf die untere Füllung . Die vollständige Liste der Variablen befindet sich in der Funktion prepareSizeRelated().

Answer 3

Wie bei dir, habe ich viele jQuery-Lösungen ausprobiert, aber endete jedes Mal wieder auf einfache alte Javascript. Unter der Annahme, jQuery ist kein absolutes Erfordernis von Ihnen, Sie so etwas wie die folgenden verwenden könnten (müssen anpassen xxx Ihren speziellen Textbereich passen soll, sein ~ 1.3):

function resizeTextarea(textarea) { 
    currentRows = textarea.value.split('\n'); 
    newRows = 1; 
    minRows = 4; 

    for(i=0; i < currentRows.length; i++) { 
    if(currentRows[i].length > textarea.cols) { 
     newRows += Math.ceil(currentRows[i].length/textarea.cols - xxx); 
    } 
    } 

    newRows += currentRows.length; 

    if(newRows != textarea.rows) { 
    textarea.rows = newRows; 
    } 
} 

Answer 4

Nun, jetzt gibt es.

Dieses Plugin heißt: automatisch anpassen,

und es here von Jack Moore

Check out gemacht hat.

(Ich weiß, diese Frage stammt aus dem Jahr 2009, aber vielleicht wird diese Zukunft Leser helfen)