请问如何模拟失去焦点事件呢?
完整程序如下。
我在按钮的click事件中,让两个input表单失去焦点。但是为什么点击按钮后,控制台不会输出username和password呢?
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>失去焦点事件</title> <meta charset="UTF-8"> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> </head> <body> <form> <input type="text" placeholder="用户名" id="username"> <input type="password" placeholder="密码" id="password"> </form> <button id="button">click</button> <script type="text/javascript"> let eleUsername = document.getElementById("username"), elePassword = document.getElementById("password"), eleButton = document.getElementById("button"); // 失去焦点时输出id eleUsername.addEventListener("blur", function() { console.log(this.id); }); // 失去焦点时输出id elePassword.addEventListener("blur", function() { console.log(this.id); }); // 点击按钮,让两个input表单发生失去焦点事件 eleButton.addEventListener("click", function() { eleUsername.blur(); elePassword.blur(); }); </script> </body> </html>
26
收起
正在回答 回答被采纳积分+1
5回答
我学习太差被关起来了
2020-01-09 15:13:28
解决方案如下:
// 点击按钮,让两个input表单发生失去焦点事件 eleButton.addEventListener("click", function() { eleUsername.focus(); eleUsername.blur(); elePassword.focus(); elePassword.blur(); });
我学习太差被关起来了
2020-01-08 22:03:50
类似的还有click事件。但是click事件却没有问题,程序如下所示。
点击button3,控制台那个输出button1和button2。
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>点击事件</title> <meta charset="UTF-8"> <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> </head> <body> <div> <button id="button1">button 1</button> <button id="button2">button 2</button> </div> <button id="button3">button 3</button> <script type="text/javascript"> let button1 = document.getElementById("button1"), button2 = document.getElementById("button2"), button3 = document.getElementById("button3"); button1.addEventListener("click", function() { console.log(this.id); }); button2.addEventListener("click", function() { console.log(this.id); }); // 点击button3,让button1和button2发生click事件 button3.addEventListener("click", function() { button1.click(); button2.click(); }); </script> </body> </html>
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星