Javascript 通过jquery一次调整一个图像的大小

所以我写了一些jquery，它基本上是用来在我点击任何图像时调整其大小，这意味着我可以点击一个图像并调整其大小，然后点击任何其他图像并开始调整其大小，但这是独立的。我必须这样做的代码如下：

$('img').click(function(e) {
  thisImage = this;
  $(document).keypress(function(event) {
    if ( event.which == 115) {
      $(thisImage).css('width', "+=25").css('height', "+=25");
    };

    if ( event.which == 97) {
      $(thisImage).css('width', "-=25").css('height', "-=25");
    };
  });
});

这在你第一次使用它时效果很好。当存在多个图像时，您可以单击图像，当您点击相应按钮时，您单击的图像将适当调整大小。但是，在单击第二个图像以调整其大小时，它和您单击的第一个图像将一起开始调整大小。这将缩放页面上可以放置的尽可能多的图像，即，单击每个图像后，三个图像将一起调整大小

有人知道为什么会这样吗？我怎么才能阻止它？我想能够单击每个图像，并能够独立调整其大小，无论它被点击的顺序。我有一种感觉，这与我使用“this”的方式有关，但我对jquery和javascript比较陌生，所以我无法想象它会是什么

任何帮助都将不胜感激。谢谢

---

-Alex

本质上，这里的问题是，每次单击图像时，都会将一个新的侦听器绑定到文档

这意味着每次按下一个键时，都会调用添加的所有侦听器。您要做的是在单击下一个图像时解除文档上仍然存在的侦听器的绑定，这意味着一次只有一个图像在侦听您的按键

例如，在中，我们有以下代码：

 $('#in').keypress(function(event) { alert('first'+event.which); });
//$('input').unbind('keypress');
$('#in').keypress(function(event) { alert('second'+event.which); });

---

它将两个侦听器添加到一个输入元素中，正如您在元素中按一个键所看到的，它会使两个侦听器都运行。实际上，每次单击图像时，您都会添加一个新的按键侦听器，而旧的侦听器永远不会被清除。如果在jsfiddle中取消对unbinding命令的注释，您将看到只会调用第二个警报，因为第一个侦听器被释放。如果您一次只希望按键收听一个图像，那么您将希望在单击侦听器的开始处具有类似于

$（文档）的内容。取消绑定（'keypress'）

（当然，这将清除所有按键，因此，如果文档中附加了其他侦听器，则需要更加小心地管理它们，对于此问题，这就足够了）。

是的，这就是此代码的工作方式

原因是，在img.click事件处理程序中，您在document.keypress上附加了一个新的事件处理程序，该处理程序将通过传递对“thisImage”的引用来调整图像的大小。 发生的情况是，此图像的document.keypress事件处理程序将继续存在，即使您单击另一个图像，并且将在每个按键上调整图像的大小

当您不断选择新图像时，这些事件处理程序将继续累积

---

您需要做的是在用户单击新图像时删除以前的事件处理程序。

您能不能也显示一部分HTML…是的，这就成功了！我想这与此类似，我只是对jquery和javascript不太熟悉，不知道这样一个命令。再次感谢！嘿，谢谢，我猜是下面的问题这里的概念是函数

keypress

只是

绑定（'keypress'…

）的别名，因此您应该了解jquery处理事件的方式，以及单线程事件循环的一般概念。希望这有助于您学习javascript，这是一种rad语言：）