Limitare i caratteri per riga in un'area di testo

Question

Ho cercato per tutto il weekend la soluzione a questa diligenza e non ho ancora trovato una soluzione che funzioni correttamente. Quello che sto cercando di ottenere è di limitare il numero di caratteri per riga in una textarea, non limitandoli in modo identico, ma un numero diverso di caratteri per riga di mia scelta.

Per esempio:

1. voglio avere solo 4 linee nella mia textarea
2. Linea 1,2 e 3 saranno limitati a 24 caratteri
3. Linea 4 avrà un numero illimitato di caratteri

Ciò è possibile con un'area di testo o esiste un altro modo di fare i con un Div o qualcosa del genere. Mi rendo conto che questo con ogni probabilità è stato già trattato in precedenza, ma trovare un copione funzionante che copra questo criterio è risultato estremamente difficile e non ho il tipo di abilità necessaria per ottenere questi risultati.

Grazie

Answer 1

Qui di seguito è una fotografia del campione del problema che si sta cercando di risolvere:

• 4 linee nella textarea (Limitare questo sul sé textarea con file = "4")
• linee 1, 2, e 3 sono limitati a 24 caratteri
• linea 4 avrà un numero illimitato di caratteri

Snapshot del textarea:

123456789
123456789
232323232323232323323232 
23232323232323232323236464536543654643 

JavaScript:

$('#your-input').keypress(function() { 
    var text = $(this).val(); 
    var arr = text.split("\n"); 

    if(arr.length > 5) { 
     alert("You've exceeded the 4 line limit!"); 
     event.preventDefault(); // prevent characters from appearing 
    } else { 
     for(var i = 0; i < arr.length; i++) { 
      if(arr[i].length > 24 && i < 3) { 
       alert("Length exceeded in line 1, 2, or 3!"); 
       event.preventDefault(); // prevent characters from appearing 
      } 
     } 
    } 

    console.log(arr.length + " : " + JSON.stringify(arr)); 
}); 

Questo può essere realizzato utilizzando un evento di pressione di un tasto. Quando viene attivato l'evento keypress, ottenere il valore corrente della casella di testo e suddividere il valore in una matrice utilizzando il carattere di interruzione di riga \n come delimitatore.

• La lunghezza dell'array indica quante linee hai. Se hai superato queste linee, attiviamo un avviso.
• La lunghezza di ogni singola stringa all'interno della matrice rappresenta la lunghezza di ciascuna linea. Utilizziamo un ciclo for per controllare le prime 3 righe. Se superiamo la lunghezza di 24, spariamo un allarme.
• Ignoriamo l'ultima iterazione del ciclo, poiché non ci interessa la lunghezza dell'ultima riga.

Questo non è progettato per essere una soluzione completa, ma questo sicuramente ti aiuterà e ti fornirà qualcosa che puoi modificare in base alle tue esigenze. In bocca al lupo!