一个简单的在线字符处理小工具

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>2LowercaseOrUppercase</title>
<script type="text/javascript" >
	function doAction(){
		var inputId = document.getElementById( 'inputId' );
		var lowercaseId = document.getElementById( 'lowercaseId' );
		var uppercaseId = document.getElementById( 'uppercaseId' );
		
		lowercaseId.value = inputId.value.toLowerCase();
		uppercaseId.value = inputId.value.toUpperCase();
	};
</script>
<style type="text/css"  rel="stylesheet" >
	input{ width: 500px; height: 30px; line-height:30px; font-size:20px; margin:5px; padding:0 20px; }
	b{ width:100px;display:inline-block; }
</style>
</head>
<body>
	<DIV>
	<B>INPUT:</B><input id='inputId' type='text' onKeyUp='doAction();'> <br/>
	<B>UPPERCASE:</B><input id='uppercaseId' type='text' readonly='true'> <br/>
	<B>LOWERCASE:</B><input id='lowercaseId' type='text' readonly='true'> <br/>
	</DIV>
</body>
</html>

你可能感兴趣的:(一个简单的在线字符处理小工具)