javascript - 使用 jQuery 在文本输入上触发 keydown，在事件发生后保留值

Question

在 angularjs 网站上使用 Tampermonkey。 每当我打开网址时，我都会在输入框中预先填充一个值，但搜索是通过键入触发的。所以我需要一个按键事件，即“空格”来触发搜索。

我已经弄清楚如何触发 keydown 事件，但它会覆盖输入框中已有的值。 如何保留它，同时仍然触发按键？

(function() {
'use strict';

var herId = getParameterByName('Q');
window.setTimeout(function() {
    var el = document.querySelector('.form-control');
    el.value = herId;
}, 200);

window.setTimeout(function() {
    var e = jQuery.Event("keydown");
    e.which = 32; // # Some key code value
    $("input").val(String.fromCharCode(e.which));
    $("input").trigger(e);
}, 1600);
})();

function getParameterByName(name, url) {
   if (!url) url = window.location.href;
   name = name.replace(/[\[\]]/g, "\\$&");
   var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
   results = regex.exec(url);
   if (!results) return null;
   if (!results[2]) return '';
   return decodeURIComponent(results[2].replace(/\+/g, " "));
}

我使用延迟是因为页面需要一些时间来加载。

Answer 1

每次运行 keydown 事件时，旧值都会被清除并替换为新的 String.fromCharCode 字符。

//Try this
(function() {
'use strict';

var herId = getParameterByName('Q');
window.setTimeout(function() {
    var el = document.querySelector('.form-control');
    el.value = herId;
}, 200);

window.setTimeout(function() {
    var e = jQuery.Event("keydown");
    e.which = 32; // # Some key code value

    $("input").val($(this).val() + String.fromCharCode(e.which));
    $("input").trigger(e);
}, 1600);
})();

function getParameterByName(name, url) {
   if (!url) url = window.location.href;
   name = name.replace(/[\[\]]/g, "\\$&");
   var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
   results = regex.exec(url);
   if (!results) return null;
   if (!results[2]) return '';
   return decodeURIComponent(results[2].replace(/\+/g, " "));
}