jQuery toggleClass example
Toggle class name on click in jQuery
HTML
<input type="text" class="full-text" placeholder="Texto completo">
<input type="text" class="short-text" placeholder="Texto abreviado">
JavaScript
$('.full-text').keyup((event) => {
const text = event.target.value
// Verifica se o input .full-text possui algum espaço em branco
if (hasWhiteSpace(text)) {
const separatedText = text.split(" ")
const firstWord = separatedText[0]
const secondWord = separatedText[1]
const thirdWord = separatedText[2]
// Caso o usuário só tenha digitado duas palavras, pegue as duas primeiras letras da primeira palavra e a última letra da terceira
if (!thirdWord) {
$('.short-text').val(getFirstTwoLetters(firstWord) + getFirstLetter(secondWord))
// Caso não, pegue a primeira letra de cada uma das palavras
} else {
$('.short-text').val(getFirstLetter(firstWord) + getFirstLetter(secondWord) + getFirstLetter(thirdWord))
}
} else {
// Caso o usuario só tenha digitado uma palavra, pegue as três primeiras letras desta palavra
$('.short-text').val(getFirstThreeLetters(text))
}
})
const getFirstLetter = s => {
if (!s) return '';
return s.charAt(0)
}
const getFirstTwoLetters = s => {
return s.substring(0, 2)
}
const getFirstThreeLetters = s => {
return s.substring(0, 3)
}
const hasWhiteSpace = (s) => {
return s.indexOf(' ') >= 0;
}