发表新帖
发表新帖

Change Input to Upper Case

前端 未结
关注
15 770
爱一瞬间的悲伤
爱一瞬间的悲伤 2020-12-07 22:02

JS:
相关标签:
15条回答
  • 被撕碎了的回忆
    2020-12-07 22:30

    I couldn't find the text-uppercase in Bootstrap referred to in one of the answers. No matter, I created it;

    .text-uppercase {
  text-transform: uppercase;
}

    This displays text in uppercase, but the underlying data is not transformed in this way. So in jquery I have;

    $(".text-uppercase").keyup(function () {
    this.value = this.value.toLocaleUpperCase();
});

    This will change the underlying data wherever you use the text-uppercase class.

    0 讨论(0)
  • 不知归路
    2020-12-07 22:30

    you can try this HTML

    <input id="pan" onkeyup="inUpper()" />

    javaScript

    function _( x ) {
  return document.getElementById( x );
}
  // convert text in upper case
  function inUpper() {
    _('pan').value = _('pan').value.toUpperCase();
  }
    0 讨论(0)
  • 野趣味
    2020-12-07 22:33 
    <input id="name" data-upper type="text"/>
<input id="middle" data-upper type="text"/>
<input id="sur" data-upper type="text"/>

    Upper the text on dynamically created element which has attribute upper and when keyup action happens

    $(document.body).on('keyup', '[data-upper]', function toUpper() {
  this.value = this.value.toUpperCase();
});
    0 讨论(0)
  • 南方客
    2020-12-07 22:34

    Here we use onkeyup event in input field which triggered when the user releases a Key. And here we change our value to uppercase by toUpperCase() function.

    Note that, text-transform="Uppercase" will only change the text in style. but not it's value. So,In order to change value, Use this inline code that will show as well as change the value

    <input id="test-input" type="" name="" onkeyup="this.value = this.value.toUpperCase();">

    Here is the code snippet that proved the value is change 

    <!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<form method="get" action="">
		<input id="test-input" type="" name="" onkeyup="this.value = this.value.toUpperCase();">
		<input type="button" name="" value="Submit" onclick="checking()">
	</form>
	<script type="text/javascript">
		function checking(argument) {
			// body...
			var x = document.getElementById("test-input").value
			alert(x);
		}
		
		
	</script>
</body>
</html>

    0 讨论(0)
  • 感情败类
    2020-12-07 22:36 
    onBlur="javascript:{this.value = this.value.toUpperCase(); }

    will change uppercase easily.

    Demo Here

    0 讨论(0)
  • [愿得一人]
    2020-12-07 22:38

    Javascript has a toUpperCase() method. http://www.w3schools.com/jsref/jsref_toUpperCase.asp

    So wherever you think best to put it in your code, you would have to do something like 

    $(".keywords").val().toUpperCase()
    0 讨论(0)
 看不清?
提交回复
热议问题