---
title: "Show image when key is pressed with jQuery"  
description: "Show image when key is pressed with jQuery"  
author: "Anonymous User"  
published: 2013-04-08  
updated: 2013-04-08  
canonical: https://www.mindstick.com/forum/732/show-image-when-key-is-pressed-with-jquery  
category: "javascript"  
tags: ["javascript"]  
reading_time: 1 minute  

---

# Show image when key is pressed with jQuery

Hi Mindstickians!\
I'm [trying](https://answers.mindstick.com/qa/93698/6-mistakes-couples-are-trying-to-save-money) to make a [simple](https://yourviews.mindstick.com/story/1469/5-simple-ways-to-stay-fit-amp-healthy) app that when a key is pressed on the [users](https://www.mindstick.com/news/2244/issue-preventing-users-from-accessing-facebook-s-social-networking-platforms-has-been-resolved) [keyboard](https://www.mindstick.com/forum/23117/android-soft-keyboard-close-hide) an [image](https://www.mindstick.com/articles/23551/an-investigate-distinctive-seafood-restaurant-for-your-image-stamp-character) appears respective to that letter. I would like to do this for the entire alphabet (a, b, c...)\
if a is pressed a.jpg [shows up](https://answers.mindstick.com/qa/50405/apple-iphone-x-shows-up-liquid-detected-error-when-charging) on my page, if r was pressed r.jpg would appear and so on.\
I was going to do this with a mega list of if else statements only im sure there must be another way?\
var ctrlPressed = false;$([window](https://www.mindstick.com/forum/161285/how-does-the-window-console-object-work-in-javascript)).keydown([function](https://www.mindstick.com/articles/13001/multi-statement-table-valued-user-defined-function-in-sql-server)(evt) { if (evt.which == 17) { // ctrl ctrlPressed = true; alert('sdf'); }})\
Thanks in [advance](https://www.mindstick.com/blog/33258/jee-mains-and-jee-advance-exams)!

## Replies

### Reply by Vijay Shukla

Hi Lois!\
Match again a-z as below\

```
$(window).keydown(function(e) {    var key = String.fromCharCode(e.which).toLowerCase();    if(/[a-z]/i.test(key) {        alert(key+'.jpg');    }});
```

### Reply by AVADHESH PATEL

Hi Lois!\
var letters = "abcdefghijklmnopqrstuvwxyz";letters = letters.split("");\
$(window).keydown(function(e){ key = e.which - 65; //makes a-z = 1-27 key = letters[key]; $('img[src="' + key + '.jpg"]').show();}


---

Original Source: https://www.mindstick.com/forum/732/show-image-when-key-is-pressed-with-jquery

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.