打字稿：按钮点击不调用功能
[英]Typescript: button click not calling function
问题描述
我对打字稿很陌生，我一直在研究一个简单的打字稿代码，只需单击一下按钮，它就会在浏览器中显示警告消息。 我尝试使用按钮和输入标签，也尝试使用onclick事件以及addEventListener。 我不太确定这里是什么问题，因此非常感谢您给予的任何帮助。
//typescript portion of code document.getElementById("disp").addEventListener("click", (evt: Event) => this.disp_alrt()); function disp_alrt(){ alert("You pressed the button!"); }
<!DOCTYPE html> <html> <head> <title>test</title> </head> <body> <input type="button" class="button" id="disp" value="Display Alert"> </body> </html>
2 个解决方案
解决方案1
0 2018-01-04 19:25:33
您可以触发事件或设置回调
//typescript portion of code document.getElementById("disp").addEventListener("click", Event => this.disp_alrt()); document.getElementById("disp2").addEventListener("click", this.disp_alrt, true); function disp_alrt(event){ alert("You pressed the button!"); }
<!DOCTYPE html> <html> <head> <title>test</title> </head> <body> <input type="button" class="button" id="disp" value="Display Alert"> <input type="button" class="button" id="disp2" value="Display Alert2"> </body> </html>
解决方案2
0 2018-01-04 19:30:33
TypeScript不是JavaScript，要运行Typescript，您需要将其转换为javascript，您可以将您的typescript代码粘贴到操场上，并获取将由浏览器执行和理解的javascript。 希望这很清楚
我转换了事件代码document.getElementById("disp").addEventListener("click", (evt: Event) => this.disp_alrt()); 在操场上，输出是
var _this = this;
document.getElementById("disp").addEventListener("click", function (evt) { return _this.disp_alrt(); });
https://www.typescriptlang.org/play/
//typescript portion of code //var _this = this; function disp_alrt(){ alert("You pressed the button!"); } document.getElementById("disp").addEventListener("click", function (evt) { return disp_alrt(); });
<!DOCTYPE html> <html> <head> <title>test</title> </head> <body> <input type="button" class="button" id="disp" value="Display Alert"> </body> </html>
单击按钮调用函数
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.