Question

我需要在输入字段中模拟用户输入：

<input type="text" id="name">

以下事件应手动触发：

鼠标单击>焦点>鼠标向上>单击>向下键>按键>更改> 模糊

代码在此处显示

如果我使用此代码，应该会发现它们：

var element = document.getElementById('name');

$(element).on('mousedown focus mouseup click keydown keypress change blur', function(e){
    console.log(e);
});

更新的文件（未检测到，没有控制台日志..）：

$("#name").trigger("mousedown");
$("#name").trigger("focus");
$("#name").trigger("mouseup");
$("#name").trigger("click");
$("#name").trigger("keydown");
$("#name").trigger("keypress");
$("#name").trigger("change");
$("#name").trigger("blur");

var element = document.getElementById('name');

$(element).on('mousedown focus mouseup click keydown keypress change blur', function(e){
    console.log(e);
});

Answer 1

您将为此使用jQuery的trigger。因此，如果您想按照您描述的顺序模拟事件：

$("#name").trigger("mousedown");
$("#name").trigger("focus");
$("#name").trigger("mouseup");
$("#name").trigger("click");
$("#name").trigger("keydown");
$("#name").trigger("keypress");
$("#name").trigger("change");
$("#name").trigger("blur");

如果您想真正模仿用户，也可以使用一些setTimeout来模拟人为延迟。祝你好运！

Answer 2

尝试-

添加Jquery插件

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>

<input type="text" id="name">

//var element = document.getElementById('name');

$("input").trigger("mousedown");
$("input").trigger("focus");
$("input").trigger("mouseup");
$("input").trigger("click");
$("input").trigger("keydown");
$("input").trigger("keypress");
$("input").trigger("change");
$("input").trigger("blur");

Answer 3

您可以使用触发器jquery函数来模拟和触发任何事件。

如何用事件模拟完整的用户输入

3 个答案: