如何通过按键使用 jquery .live() ？

Question

我正在为客户制作一个摄影作品集，并决定使其更具互动性。我去掉了网站上的所有按钮，并让用户使用击键与网站进行交互。我的原始代码使用：

$(document).bind('keydown', function( e ) {

但不幸的是，这不允许用户与通过 jquery 加载的图片进行交互。因此访问者只能与第一张图片进行交互。我环顾四周，发现 .live() 方法应该将事件绑定到所有对象，无论是在文档加载时还是在文档加载后加载。但由于某种原因，它不适用于我的代码。我正在使用 jquery 1.4.2，这是我的代码示例：

$(document).live('keydown', function( e ) { 

 if (e.keyCode == 32) { 

     var imgwidth = $('#gallery img').attr('width');

     if(imgwidth == 640) {

     $('#content div#image').removeClass('large');

     $('#content img').removeClass('large');

     }else{

     $('#content div#image').addClass('large');

     $('#content img').addClass('large');

     }
     return false;
     };
 });

任何帮助将不胜感激！

Answer 1

我认为问题不在于绑定事件的方式。

在事件处理程序中，您可以执行以下操作：

var imgwidth = $('#gallery img').attr('width');

这将为您提供第一个图像的宽度（请参阅 attr 文档）。

如何确定用户正在与哪张图像进行交互？如果它有焦点，那么你可以这样做

$('#gallery img').live("keydown", function(e) {
  // here, 'this' is the DOM image object, and $(this) is the jQuery object for it
  // ...
});

……但关键是，你需要某种方法让计算机确定用户打算与哪个图像进行交互。