Question

我正在开发一个带有chrome插件的项目来操作网站内容并添加更多功能。我有一个＆lt; select＆gt;我要操纵的元素：＆lt; select id =＆＃34; thePage：form：pBlock：address：addressTypeSelectionDropdown＆＃34;命名=＆＃34;翻动书页：形式：pBlock：地址：addressTypeSelectionDropdown＆＃34;大小=＆＃34; 1＆＃34;平变化=＆＃34; onchangeOfPicklist（）;＆＃34;＆GT; ＆lt; option value =＆＃34; User Entry＆＃34;＆gt; User Entry＆lt; / option＆gt; ＆lt; option value =＆＃34; CustomerID＆＃34;＆gt; CustomerID＆lt; / option＆gt; ＆lt; option value =＆＃34;最贴近客户＆＃34;＆gt;最贴近客户＆lt; /选项＆gt; ＆lt; option value =＆＃34; Location＆＃34;＆gt; Location＆lt; / option＆gt; ＆lt; option value =＆＃34;客户的地址＆＃34;选择=＆＃34;已选择＆＃34;＆gt;客户的地址＆lt; /选项＆gt; ＆LT; /选择＆GT; 我想在特定条件下更改选择选项，但这似乎无论我做什么都不行。到目前为止，我已经尝试了几乎所有的东西，但似乎onchange触发器正在做魔术，否则点击模拟并试图改变选项似乎不起作用。到目前为止，我尝试过不同的方法，但它们似乎都不会触发一个选项： let customerAddress = labelAddress.parent（）。next（）。first（）。find（＆＃34; select＆＃34;）; customerAddress.children（＆＃39; [value =＆＃34;最贴近客户＆＃34;]＆＃39;）。触发（＆＃34;更改＆＃34;）; 并且： customerAddress.children（＆＃39; [value =＆＃34;最接近客户＆＃34;]＆＃39;）。attr（＆＃34;选择＆＃34;，＆＃34;选择＆＃34;）; customerAddress.children（＆＃39; [value =＆＃34;最接近客户＆＃34;]＆＃39;）。change（）; 和 customerAddress .find（＆＃39;选项：最贴近客户＆＃39;） .prop（＆＃39;选择＆＃39;，真） .trigger（＆＃39;变更＆＃39）; 甚至模拟按键：让e = jQuery.Event（＆＃34; keydown＆＃34;）; e.which = 13; //＃enter customerAddress.focus（）; customerAddress.trigger（E）; 在这里，我不知道为什么没有触发事件。我添加了一个事件监听器，控制台没有指示事件触发器： document.addEventListener（＆＃34; keydown＆＃34;，function（event）{ console.log（＆＃34; KeyPress：＆＃34; + event.which）; }）; 或者像这样：让e = jQuery.Event（＆＃34; keydown＆＃34;）; e.which = 13; //＃enter customerAddress.focus（）; customerAddress.attr（＆＃34; size＆＃34;，5）; customerAddress.children（＆＃39; [value =＆＃34;最贴近客户＆＃34;]＆＃39;）。focus（）; customerAddress.children（＆＃39; [value =＆＃34;最接近客户＆＃34;]＆＃39;）。触发器（e）; 请注意我正在使用chrome插件，我只能更改此插件的源代码并操作网页上的元素，无法更改网页/脚本和函数的源代码。我的问题是，有没有办法在＆lt; select＆gt;中触发嵌入式onchange功能？元件？ https://jsfiddle.net/zlobul/sb8js1we/11/

Answer 1

你试过了吗？

let select = document.getElementById("thePage:form:pBlock:address:addressTypeSelectionDropdown")
select.addEventListener("change", (event)=>{
    console.log(event)
    var s = document.createElement('script');
    s.setAttribute('type', 'text/javascript');
    s.content = "onchangeofPicklist()"
    select.appendChild(s);
})

您需要使用事件侦听器拦截change事件，并且您应该能够从新的（扩展的）处理程序by injecting a script into the document调用现有的更改事件处理程序（如果需要）。

JSFiddle

Answer 2

更改事件在select元素级别而非option处触发，因此：

let customerAddress = labelAddress.parent().next().first().find("select");
customerAddress.change();

应该执行该操作并为select元素触发change事件。如果要设置值，请使用val（）：

customerAddress.val("Closest to Customer");

请参阅Set an option value as selected

Answer 3

好的，这就是我要做的，类似于Michael.Lumley的回答：

let execFunct = function () {
    let script: HTMLScriptElement = document.createElement("script");
    script.textContent = "onchangeOfPicklist()";
    (document.head || document.documentElement).appendChild(script);
    script.parentNode.removeChild(script);
}

一旦我更改了下拉菜单，便执行execFunct（）。

无法使用onchange函数模拟<select>元素上的click事件

3 个答案: