核心提示：主要代码!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN https://www.w3.org/TR/xhtml1/DTD/xht...
主要代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>键盘对应数字</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
var x=0;
function a1(){
x=x+1;
//alert(x);
document.getElementById("num1").value=x;
var tt1=document.getElementById("t1");
var tt2=document.getElementById("t2");
tt2.value=event.keyCode;
//var texts1=document.getElementById("text1");
//texts1.value=tt1.value+"--"+tt2.value;
//document.getElementById("text1").value=tt1.value+"--"+tt2.value;
if(tt2.value=="8"){
tt1.value="BackSpace"
}else if(tt2.value=="9"){
tt1.value="Tab"
}else if(tt2.value=="13"){
tt1.value="Enter"
}else if(tt2.value=="16"){
tt1.value="Shift"
}else if(tt2.value=="17"){
tt1.value="Ctrl"
}else if(tt2.value=="18"){
tt1.value="Alt"
}else if(tt2.value=="20"){
tt1.value="CapsLpck"
}else if(tt2.value=="27"){
tt1.value="Esc"
}else if(tt2.value=="32"){
tt1.value="Space"
}else if(tt2.value=="33"){
tt1.value="PgUp+"
}else if(tt2.value=="34"){
tt1.value="PgUp- "
}else if(tt2.value=="35"){
tt1.value="End"
}else if(tt2.value=="36"){
tt1.value="Home"
}else if(tt2.value=="37"){
tt1.value="←"
}else if(tt2.value=="38"){
tt1.value="↑"
}else if(tt2.value=="39"){
tt1.value="→"
}else if(tt2.value=="40"){
tt1.value="↓"
}else if(tt2.value=="44"){
tt1.value="PrtScr"
}else if(tt2.value=="45"){
tt1.value="Ins"
}else if(tt2.value=="46"){
tt1.value="Del"
}else if(tt2.value=="80"){
tt1.value="P/屏幕管理"
}else if(tt2.value=="91"){
tt1.value="Win"
}else if(tt2.value=="93"){
tt1.value="Right Click"
}else if(tt2.value=="107"){
tt1.value="+"
}else if(tt2.value=="109"){
tt1.value="'-'"
}else if(tt2.value=="106"){
tt1.value="*"
}else if(tt2.value=="111"){
tt1.value="/"
}else if(tt2.value=="112"){
tt1.value="F1"
}else if(tt2.value=="113"){
tt1.value="F2"
}else if(tt2.value=="114"){
tt1.value="F3"
}else if(tt2.value=="115"){
tt1.value="F4"
}else if(tt2.value=="116"){
tt1.value="F5"
}else if(tt2.value=="117"){
tt1.value="F6"
}else if(tt2.value=="118"){
tt1.value="F7"
}else if(tt2.value=="119"){
tt1.value="F8"
}else if(tt2.value=="120"){
tt1.value="F8"
}else if(tt2.value=="121"){
tt1.value="F10"
}else if(tt2.value=="122"){
tt1.value="F11"
}else if(tt2.value=="123"){
tt1.value="F12"
}else if(tt2.value=="144"){
tt1.value="Num"
}else if(tt2.value=="173"){
tt1.value="启用/关闭声音"
}else if(tt2.value=="174"){
tt1.value="减小声音"
}else if(tt2.value=="175"){
tt1.value="增大声音"
}else if(tt2.value=="192"){
tt1.value="~"
}else if(tt2.value=="255"){
tt1.value="启用/关闭触摸板功能"
}
//添加p标签
$("#text1").append("<p style='width:110px;height:20px;float:left;'>"+tt1.value+'--'+tt2.value+"</p>");
//第一个文本框输出一次置空一次
$("#t1").val("");
//第二个文本框根据第一个文本框输出
$("#t2").val();
}
</script>
</head>
<style>
#text1{
height:400px;
width:100%;
overflow:scroll;
}
#num1{
width:30px;
font-size:18px;
text-align:center;
}
</style>
<body onkeyup="a1()"> <!--焦点-->
输入键盘上任意数字：<input type="text" id="t1" autofocus="autofocus"/>
<!--禁止输入-->
对应的键盘按键数字：<input type="text" id="t2" readonly="readonly"/>
当前第<input type="text" id="num1"/>次<br />
<h2>记录</h2>
<p onkeydown="a1()" id="text1"></p>
</body>
</html>
倒序排列关键代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
</head>
<body>
<p class="outerp">
<p>01</p>
<p>02</p>
<p>03</p>
</p>
<script type="text/javascript">
/*jquery写法*/
$(".outerp p").each(function(){
$(this).prependTo(".outerp");
})
/*javascript原生倒叙排列
var index = document.querySelectorAll(".outerp p");
for(var i=index.length-1;i>-1;i--){
document.querySelector(".outerp").appendChild(index[i]);
} */
</script>
</body>
</html>
