Обратный регистр (нижний/ Верхний регистр) входного значения посимвольно

#javascript #html #string

#javascript #HTML #строка

Вопрос:

При использовании одного текстового поля ввода и типа ввода допускаются только алфавиты.Введенное значение равно «a», и оно должно отображаться вне текстового поля как «A»?

Если мы введем алфавитную букву «а» во входном тексте, тогда потребуется отобразить заглавную букву «А» снаружи поля… Ниже приведен мой html-код:

 <!DOCTYPE html>
   <html>
      <head>
         <!--<script type="text/javascript" href="check.js"></script>-->
      </head>
        <body>
          <input type="text">
             <script>
                function myFunction()
                {
                    var A = document.getElementById('input').value; 
                    console.log('alphabet'.toUpperCase());
                }
             </script>
       </body>
    </html>
 

Комментарии:

1. Вы не сформулировали вопрос. И ваша функция myFunction никогда не вызывается, в которой ваша переменная A никогда не используется и в которой вы регистрируете постоянную строку.

2. @SaiKrishna разве мой ответ не решает вашу проблему?

Ответ №1:

Чтобы отобразить входное значение с обратным регистром, вы должны:

  1. Вызовите свою функцию в onkeyup случае вашего ввода, чтобы немедленно обновить предварительный просмотр введенной строкой.
  2. И перебирайте вашу строку и для каждого символа проверяйте, если она находится в uppercase обратном порядке, lowercase или сделайте это uppercase , если это так lowercase .

Вот демонстрационный фрагмент:

 function myFunction() {
  var A = document.getElementById('input').value;
  var output = '';
  for (var i = 0, len = A.length; i < len; i  ) {
    var character = A[i];
    if (character == character.toLowerCase()) {
      // The character is lowercase
      output = output   character.toUpperCase();
    } else {
      // The character is uppercase
      output = output   character.toLowerCase();
    }
  }
  document.getElementById("preview").innerText = output;
} 
 <input id="input" type="text" pattern="[A-Za-z]" onkeyup="myFunction()" /><span id="preview"></span> 

Ответ №2:

Вы можете использовать событие для немедленного обновления результата во время записи.

 document.getElementById('input').addEventListener('keyup', function () {
    var input = document.getElementById('input').value;
    if (!input.match(/^[a-z]*$/i)) {
        document.getElementById('output').innerHTML = 'Wrong input';
        return;
    }
    document.getElementById('output').innerHTML = input.split('').map(function (a) {
        return a.match(/[a-z]/)  ? a.toUpperCase() : a.toLowerCase();
    }).join('');
}); 
 <input type="text" id="input">
<div id="output"></div> 

Комментарии:

1. Все в порядке … предположим, если мы вставим элемент ‘A’ в текстовое поле ввода, тогда он будет отображать маленькую ‘a’ и наоборот..

Ответ №3:

 function reverseCase(str) {
    let newstr = str.split('');
    let newarr = [];
    //return newstr;
    for(i=0; i<newstr.length; i  ) {
        if(newstr[i] == newstr[i].toLowerCase()){
            newarr.push(newstr[i].toUpperCase());
        }else 
        if(newstr[i] == newstr[i].toUpperCase()){
            newarr.push(newstr[i].toLowerCase());
        }
    } return newarr.join('');
}
console.log(reverseCase("Happy Birthday"))