按字符输入值的反向大小写（小写/大写）

通过使用一个输入文本框和输入类型只允许输入英文字母。输入的值为'a'，它应该在文本框外显示为'A' ？按字符输入值的反向大小写（小写/大写）

如果我们输入的拼音小“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>

来源

2016-10-14 Sai Krishna

你没有制定一个问题。你的函数'myFunction'永远不会被调用，其中你的变量'A'永远不会被使用，并且你在其中记录一个常量字符串。 –

@SaiKrishna不能解决你的问题吗？ –

为了显示与情况下，输入值相反，你应该：

调用函数在onkeyup事件的输入与输入的字符串立即更新预览。
并通过您的字符串并为每个字符测试回路，如果它在 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>

来源

2016-10-14 10:44:58

您可以使用事件立刻更新的结果，一边写。

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>

来源

2016-10-14 10:52:57

它可以......假设我们在输入文本框中插入元素'A'，那么它将显示小'a'，反之亦然。 –

@SaiKrishna，请参阅编辑。 –

按字符输入值的反向大小写（小写/大写）

回答

相关问题