1

ユーザーのキーボードでキーを押すと、その文字に対応する画像が表示されるシンプルなアプリを作成しようとしています。アルファベット全体（a、b、c ...）に対してこれを行いたい

a を押すと a.jpg がページに表示され、r を押すと r.jpg が表示されます。

if else ステートメントの巨大なリストでこれを行うつもりでしたが、別の方法があるに違いないと確信していますか?

var ctrlPressed = false;
$(window).keydown(function(evt) {
  if (evt.which == 17) { // ctrl
    ctrlPressed = true;
      alert('sdf');
  }
})
4

5 に答える 5

2

これは私がこれを行う方法です：

var letters = "abcdefghijklmnopqrstuvwxyz";
letters = letters.split("");
//I'm lazy; you should define an array of letters

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

ここに動作するjsFiddleがあります

ソース

jQuery API - キーダウン
jQuery API - 属性 Equals セレクター
MDN - String.split

于 2013-04-08T09:00:47.877 に答える
0

アルファベットの KeyCodes を使用して画像ファイルに名前を付ける必要があります。

たとえば、入力した文字「a」は「97.jpg」という名前にする必要があります。

したがって、次のように jquery から呼び出すことができます。

$(document).ready(function(){
    $("#input").bind('keypress', function (e) {
        console.log(e.which);  //or alert(e.which);  
        $("#Image").attr("src", e.which + ".jpg");
    });
});
于 2013-04-08T09:10:28.560 に答える