請你使用鍵盤輸入一些字符，這些字符就被顯示在網(wǎng)頁的空白處，是不是少了文本框或文本域之類的東西，覺得挺不習慣呢？這個效果是應用了JavaScript中的document.onkeypress對象，監(jiān)測鍵盤的一舉一動，并記錄下哪些鍵被按下，有意思吧，想研究Js的朋友，就從這些小例子開始吧。

運行效果截圖如下：

在線演示地址如下：

http://demo.jb51.net/js/2015/js-web-show-key-press-codes/

具體代碼如下：

<html>
<head>
<title>將按下的按鍵顯示在頁面上</title>
<script language="javascript">
<!--
 str = "";
 function showkey(){
  asc = event.keyCode;
  key = String.fromCharCode(asc);
  str += key;
  txt.innerHTML = str;
 }
 document.onkeypress=showkey;
-->
</script>
</head>
<body>
請使用鍵盤輸入文字：
<div id="txt"></div>
</body>
</html>

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

您可能感興趣的文章:

相關(guān)文章

jsonp跨域獲取數(shù)據(jù)的基礎(chǔ)教程
這篇文章主要給大家介紹了關(guān)于jsonp跨域獲取數(shù)據(jù)的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2018-07-07
JS圖片無縫、平滑滾動代碼
這篇文章主要介紹了JS圖片無縫、平滑滾動的實現(xiàn),需要的朋友可以參考下
2014-03-03
iframe里使用JavaScript控制主頁轉(zhuǎn)向的方法
這篇文章主要介紹了iframe里使用JavaScript控制主頁轉(zhuǎn)向的方法,涉及使用javascript實現(xiàn)iframe頁面跳轉(zhuǎn)的技巧,需要的朋友可以參考下
2015-04-04
JS函數(shù)基本定義與用法示例
這篇文章主要介紹了JS函數(shù)基本定義與用法,結(jié)合實例形式分析了JavaScript函數(shù)基本定義、參數(shù)、返回值等相關(guān)使用技巧,需要的朋友可以參考下
2020-01-01
layui 圖片上傳+表單提交+ Spring MVC的實例
今天小編就為大家分享一篇layui 圖片上傳+表單提交+ Spring MVC的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2019-09-09
JS將滑動門改為選項卡（需鼠標點擊）的實現(xiàn)方法
這篇文章主要介紹了JS將滑動門改為選項卡（需鼠標點擊）的實現(xiàn)方法,涉及JavaScript頁面元素遍歷及樣式替換的相關(guān)技巧,再通過onmouseover與onclick即可分別實現(xiàn)滑動門與選項卡兩種效果,需要的朋友可以參考下
2015-09-09
Three.js+React實現(xiàn)3D文字懸浮效果
這篇文章主要介紹了如何利用Three.js+React制作出神奇的3D文字懸浮效果，文中的示例代碼講解詳細，感興趣的小伙伴可以動手嘗試一下
2022-03-03
javascript 操作cookies及正確使用cookies的屬性
在 JS(JavaScript) 操作cookies比較復雜，在 ASP 里面我們只需要知道 cookie 的名稱、cookie 的值就行了，而 JS 里面，我們面對的是 cookie 的字符串，你自己編寫這個字符串寫入客戶端，然后自己解析這個字符串。
2009-10-10
JS FormData上傳文件的設(shè)置方法
使用FormData上傳文件時，總是獲取不到req.file對象。發(fā)現(xiàn)是沒有配置對FormData導致的，怎么解決這個問題呢？下面小編給大家?guī)砹薐S FormData上傳文件的設(shè)置方法，需要的朋友參考下吧
2017-07-07
對字符串進行HTML編碼和解碼的JavaScript函數(shù)
對字符串進行HTML編碼和解碼的JS函數(shù)，記下了方便以后找 :)
2010-02-02