keypress event demonstration

dabblet.css

/* keypress event demonstration */
form {
	padding-top: 30px;
}

dabblet.html

<form>
    <label for="keypress">Keypress</label>
    <input name="keypress"/>
</form>
<div id="target">
    <p>The last key code you entered for keypress is: <span id="keypressEcho"></span></p>
</div>

dabblet.js

// Getting the target elements from the DOM that we would like to mess with.
var keypressInput = document.getElementsByName('keypress')[0];
var keypressTarget = document.getElementById('keypressEcho');

// This is going to run the function whenever a keypress event occurs on the Input element.
keypressInput.addEventListener('keypress', function(e) {
	//Change the text of the target element to be the number of the key pressed. (number is based on the ASCII key standard.)
	keypressTarget.textContent = e.which;
	// Log the key event as well.
    console.log(e.which);
});

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}