Question

我在一个文档中有两个事件，如下所示：

$qtyFields.on("keypress input", function(){
   // stuff happening
   $passengerAmount.trigger("passengerQtyChanged", [total]);
});

$passengerAmount.on("passengerQtyChanged", function (event, total) {
   // more stuff happening
   var ev = $.Event("keypress");
   ev.which = 13;
   ev.keyCode = 13;
   $(this).trigger(ev);
});

Event.observer(window, 'load', function() {
   // some stuff happening after window load
});

我正在研究出售乘船游览的Magento（1.9）网店。在产品页面上，客户可以输入他们想要订购的门票数量（例如：1名成人，2名儿童）。当人们输入号码时，根据输入的乘客数量，出现乘客表格（客户可以输入其个人信息的表格）。因此，如果他们进入2名成人和1名儿童，将会出现3种形式。

$qtyFields是输入[type =“number”]字段，人们可以在其中输入乘客数量。
$passengerAmount是生成表单的div。

可以通过两种方式输入乘客数量：

是在键盘上使用向上和向下箭头，还是点击input[type="number"]
是使用键盘上的小键盘数字

第一种方法非常有效，对此没有任何疑问。但是当我使用第二种方法时，只有在输入数字后按Enter键才会显示正确的价格（乘客*乘客价格）。

这就是为什么我想让jQuery触发enter按钮的按键，所以每次通过方法2输入数字时价格都会更新。

问题是，按键事件是不起作用的。加载事件（最后一行）运行良好，所以我认为这两个事件相互冲突。是这样的吗？如果是，那么什么是合适的解决方案？

HTML的简单版本：

<div class="container">
  <div class="input">
     <input type="number">
  </div>
  <div class="passenger-forms">
     <!-- here be forms -->
  </div>
</div>

Answer 1

我已经得到了答案，只需将事件移动到文档顶部的on（）函数：

$qtyFields.on("keypress input", function(){
   var ev = $.Event("keypress");
   ev.which = 13;
   ev.keyCode = 13;
   $(this).trigger(ev);
   // stuff happening
   $passengerAmount.trigger("passengerQtyChanged", [total]);
});

$passengerAmount.on("passengerQtyChanged", function (event, total) {
   // more stuff happening
});

Event.observer(window, 'load', function() {
   // some stuff happening after window load
});

一个文档中的多个事件

1 个答案: