Question

我编写了一些代码，用于更改magento 1.9电子商务网站上的输入数量。

jQuery("input.qty").val("10");

问题是触发总计更新的javascript不会触发。我发现代码负责，它看起来像这样：

(function() {
  var qtyFields = $('super-product-list').select('input.qty');
  qtyFields.each(function(el) {
    el.observe("change", updateGroupedPrice);

  });

  Event.observe(window, "load", updateGroupedPrice);

  function updateGroupedPrice() {
    //do stuff
  }
})();

我认为这是使用prototype.js但是我试图在codepen中将其隔离但是无法使其正常工作。

我试图像这样触发更改事件：

jQuery("input.qty").trigger("change")

但它不起作用。我还经历了一系列其他事件，但在开发工具中它显示了监听“更改”的代码。

有谁知道为什么我不能触发改变？

Answer 1

由于页面使用的是Prototype.js，您应该继续使用它来触发您的更改。如果你在这里引入jQuery，你就是a）加载Prototype已经完成的另一个完整副本，并且b）在$()是两个库中的方法的事实中要求很多麻烦。

你的jQuery对我来说也有点可疑。你正在设置一个选择器的值（我想），但你用类名来解决它，所以页面中可能有多个select.qty，所有这些都将变为值10，触发关闭（可能）多个回调函数。

您在此处看到的Prototype代码正在设置一个“监听器”，用于更改您将在jQuery中作为$(#super-product-list input.qty)输入进行处理的内容。

jQuery总是将$()视为返回一个对象数组，因此它的所有方法都作用于数组，即使它只包含一个成员。 Prototype有两种不同的方法来访问DOM中的元素：$('some_id')，它总是返回一个元素（如果没有匹配则没有）; $$('some css selector')，它总是返回一个数组（零或更多匹配）元件）。您将以不同方式编写（或使用本机）回调方法，具体取决于您用于收集元素的访问者。

如果要更改其中一个输入，则需要在设置其值之前将其隔离。

假设您的qty元素中有三个选择选择器，其中包含类别#super-product-list。您想将第三个更改为10：

$('super-product-list').select('input.qty').last().setValue('10');

或者，比这更聪明，你为第三个添加一个ID，然后你的代码更短：

$('quantity_3').setValue('10');

在任何一种情况下，这都会从您的选择中发送“更改”事件，updateGroupedPrice方法会观察到并执行您编写的任何操作。

您不需要（也不应该）触发change事件 - 这是“本机”事件，浏览器拥有它。 jQuery的trigger()（Prototype中的fire()专门用于“合成事件”，就像你在Bootstrap中看到的那样：show.bs.modal，hide.bs.modal等。你可以发现这些通过名称中的标点符号;通常用点或冒号命名事件并避免与其他代码冲突。

最后，如果您确实真的想要将整个页面上的每个#super-product-list select.qty元素更改为“10”，那么您可以在Prototype.js中执行此操作：

$$('#super-product-list select.qty').invoke('setValue', 10);

触发输入

1 个答案: