Remove All Blanks from TextArea

Question

Remove All Blanks from TextArea

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I'd like to know how to remove all whitespace from a textarea .

I have a field textarea that copies the value to a second field textarea , I would like to execute a function that removes space or line break. My role did not work.

$(function () {

    $('#texto').on('input', function () {
        var texto = $(this).val();
        function trim(texto) {
                return texto.replace(/^\s+|\s+$/g,"");
        }
        $('#convertido1').val(texto);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container" style="margin-top:100px">

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="textoOriginal">Insira seu Texto</label>
                <textarea class="form-control" id="texto" class="texto" rows="3"></textarea>
            </div>
        </div>
        <div class="col-md-6">
            <label for="textoConvertido">Insira seu Texto</label>
            <textarea class="form-control" id="convertido1" name="convertido1" rows="3"></textarea>
        </div>
    </div>

</div>

javascript jquery

asked by anonymous 21.11.2017 / 15:50

2 answers

How to add columns from different tables? Apply CSS to a line

score 1 · Answer 1

Try this:

$(function () {
  $('#texto').on('input', function () {
    var texto = $(this).val();
    texto = texto.replace(/^\s+|\s+$/g,"");
    
    $('#convertido1').val(texto);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container" style="margin-top:100px">

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="textoOriginal">Insira seu Texto</label>
                <textarea class="form-control" id="texto" class="texto" rows="3"></textarea>
            </div>
        </div>
        <div class="col-md-6">
            <label for="textoConvertido">Insira seu Texto</label>
            <textarea class="form-control" id="convertido1" name="convertido1" rows="3"></textarea>
        </div>
    </div>

</div>

NOTE: The regex was made to remove spaces and breaks from the beginning and end of the text only, if you want to remove all spaces and breaks of the text, just change your regex to:

/\s/g

score 0 · Answer 2

This code causes two spaces to be replaced by one, and the line break is removed allowing the user to use only one space to separate the text.

$(function () {

    $('#texto').on('input', function () {
        let texto = $(this).val().replace(/\s{2,}/g,' ');
        $(this).val($(this).val().replace(/\r?\n|\r/g,'').replace(/\s{2,}/g,' '));
        $('#convertido1').val(texto);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container" style="margin-top:100px">

    <div class="row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="textoOriginal">Insira seu Texto</label>
                <textarea class="form-control" id="texto" class="texto" rows="3"></textarea>
            </div>
        </div>
        <div class="col-md-6">
            <label for="textoConvertido">Insira seu Texto</label>
            <textarea class="form-control" id="convertido1" name="convertido1" rows="3"></textarea>
        </div>
    </div>

</div>

But if you do not want any space to use replace(/\s{2,}/g,'') instead of replace(/\s{2,}/g,' ') .