如何从 Chrome 扩展调用 OnBlur 方法

Question

我正在开发 Chrome 扩展程序，它只是让所有者帐户文本框与计划帐户文本框相同。文本框在原网站上有onblur方法，调用了很多函数后通过迂回的方式将数据保存到服务器。

当我更改一个文本框时，我设置了另一个文本框的值。这在视觉上有效。但是对于我实际上没有点击的文本框，数据并没有保存到网络中。（OwnerAccount 已更新，Scheduling Account 未更新）

var tbOwnerAccount = document.getElementById("ctl00_ContentPlaceHolder1_txtOwnerAccountNumber");
var tbSchedulingAccount = document.getElementById("ctl00_ContentPlaceHolder1_txtSchedulingAccountNumber");

tbSchedulingAccount.value = tbOwnerAccount.value;

但现在是时候将值保存到服务器了。我认为简单地模糊调度帐户会调用 tbSchedulingAccount 的 onblur() 方法。没有骰子。

tbSchedulingAccount.blur();

我也试过：

tbSchedulingAccount.focus();
tbSchedulingAccount.select();
tbSchedulingAccount.value = tbOwnerAccount.value;

（最后有和没有模糊——用户自然会点击某个地方，所以如果我能把光标放在 tbSchedulingAccount 文本框中，它应该自己模糊）

我尝试使用 Chrome 控制台调用函数，它有效：

tbSchedulingAccount.onblur();

但我无法让它真正模糊并使用 tbSchedulingAccount.blur();

调用函数

如果有任何帮助，这是我试图模糊的元素：

<input name="ctl00$ContentPlaceHolder1$txtSchedulingAccountNumber"
type="text" maxlength="25" id="ctl00_ContentPlaceHolder1_txtSchedulingAccountNumber"
tabindex="9" class="textbox" onblur=" MASSIVE PROPRIETARY FUNCTION"
onkeydown="javascript:if(event != null &amp;&amp; event.keyCode == 13){ 
MASSIVE PROPRIETARY FUNCTION" style="width:200px;">

所以，我的主要问题是：

当另一个文本框失去焦点时，我可以从扩展中调用 onblur 函数吗？

（我应该注意，我想从（tbOwnerAccount）调用该函数的文本框在原始网站中有一个我不能弄乱的onblur，或者它不会保存到服务器）

到目前为止，这是我的所有代码：

var tbOwnerAccount = document.getElementById("ctl00_ContentPlaceHolder1_txtOwnerAccountNumber");
tbOwnerAccount.onblur = updateSchedule;

function updateSchedule(){
    var tbOwnerAccount = document.getElementById("ctl00_ContentPlaceHolder1_txtOwnerAccountNumber");
    var tbSchedulingAccount = document.getElementById("ctl00_ContentPlaceHolder1_txtSchedulingAccountNumber");

    console.log("Fired");

    <CODE FOR THE ORIGINAL WEBSITE'S .ONBLUR ON tbSchedulingAccount TO FIRE>

}

感谢您提供的任何帮助！

Answer 1

尝试调度 blur 事件：

tbOwnerAccount.dispatchEvent(new Event('blur'))

或运行 onblur() 直接在注入的 DOM-脚本中：

runDOMscript(function() {
    document.getElementById("ctl00_ContentPlaceHolder1_txtOwnerAccountNumber").onblur();
});

function runDOMscript(fn) {
    var script = document.head.appendChild(document.createElement('script'));
    script.text = '(' + fn + ')()';
    script.remove();
}

请参阅 Inject code in a page using a Content script，其中解释了页面代码上下文和内容脚本代码之间的差异，并展示了如何运行在页面上下文中编码。

如何从 Chrome 扩展调用 OnBlur 方法

How to Call an OnBlur Method from a Chrome Extension

javascript

textbox

google-chrome

onblur

google-chrome-extension