onkeypressイベント（キープレスイベント）とは、キーボードの何れかのキーを押した時のイベント。
構文
HTML
<element onkeypress="イベントハンドラ">
例
INPUT要素
<input type="text" onkeypress="イベントハンドラ" />
JavaScript
object.onkeypress = function(){ イベントハンドラ };
サンプル１
HTMLドキュメント上でイベントハンドラを登録するサンプル。
最後に入力した文字以外のテキスト：
サンプル１の動作について
テキスト入力欄にキーボードのキーを押して入力すると、「最後に入力した文字以外のテキスト：」の右横に、最後に入力した文字以外のテキストを表示する。
サンプル１のソースコード
JavaScript
<script type="text/javascript">
function sample1getValue() {
var $sample1value = document.getElementById( "sample1input" ).value;
document.getElementById( "sample1output" ).innerHTML = $sample1value;
}
</script>
function sample1getValue() {
var $sample1value = document.getElementById( "sample1input" ).value;
document.getElementById( "sample1output" ).innerHTML = $sample1value;
}
</script>
HTML
<p><input type="text" id="sample1input" onkeypress="sample1getValue();" /></p>
<p>最後に入力した文字以外のテキスト：<span id="sample1output"></span></p>
<p>最後に入力した文字以外のテキスト：<span id="sample1output"></span></p>
サンプル２
JavaScript上で動的にイベントハンドラを登録するサンプル。
最後に入力した文字以外のテキスト：
サンプル２の動作について
テキスト入力欄にキーボードのキーを押して入力すると、「最後に入力した文字以外のテキスト：」の右横に、最後に入力した文字以外のテキストを表示する。
サンプル２のソースコード
JavaScript
<script type="text/javascript">
window.onload = function () {
document.getElementById( "sample2input" ).onkeypress = function(){
sample2getValue();
};
}
function sample2getValue() {
var $sample2value = document.getElementById( "sample2input" ).value;
document.getElementById( "sample2output" ).innerHTML = $sample2value;
}
</script>
window.onload = function () {
document.getElementById( "sample2input" ).onkeypress = function(){
sample2getValue();
};
}
function sample2getValue() {
var $sample2value = document.getElementById( "sample2input" ).value;
document.getElementById( "sample2output" ).innerHTML = $sample2value;
}
</script>
HTML
<p><input type="text" id="sample2input" /></p>
<p>最後に入力した文字以外のテキスト：<span id="sample2output"></span></p>
<p>最後に入力した文字以外のテキスト：<span id="sample2output"></span></p>