从Firefox / Chrome控制台

Question

我正在学习javascript（使用浏览器的firebug控制台），并且在输入命令时无法理解如何激活更改。

例如，一个网站的下拉框名称为“mvprodvaronetimeorder”，其中包含以下几个选项： IpA-Q-Q，IpQ-Q-Q，Ipw-Q-Q ......我可以使用该命令获得第3个值：

    document.getElementsByName("mvprodvaronetimeorder")[0].value="Ipg-Q-Q"; 

但是，当我从下拉框中选择相应的值时，它不会激活相同的操作（显示另一个下拉列表以供选择）。然后，我无法与第二个下拉框和其他事情进行交互。

当我尝试使用如下命令填充文本框时会发生同样的事情：

            document.getElementById("luckyme")[0].value="You are lucky"; 

虽然它发生了变化，但是当我点击提交按钮时更改没有反映出来，它要求我复制粘贴或至少点击该文本框以激活更改。

有没有人可以建议我如何从控制台自动化该过程？

Answer 1

在JavaScript中分配值会更新选择，但它不会通知在该页面上运行的代码。

要使页面对更改做出反应，您还需要在下拉列表中触发更改事件：

var el = document.getElementsByName("mvprodvaronetimeorder")[0];
el.value = "Ipg-Q-Q"
el.dispatchEvent(new Event("change"))

然后页面知道选择已更改，并显示下面的新下拉列表。

要了解元素正在侦听哪些事件，您可以使用getEventListeners：

getEventListeners(document.getElementsByName("mvprodvaronetimeorder")[0])
// Object {change: Array[1]}