首页  >  文章  >  web前端  >  如何从 HTML 按钮正确调用 JavaScript 函数?

如何从 HTML 按钮正确调用 JavaScript 函数?

Barbara Streisand
Barbara Streisand原创
2024-11-26 00:03:13205浏览

How to Properly Call a JavaScript Function from an HTML Button?

使用 HTML 按钮调用 JavaScript 函数

您正在尝试使用 HTML 按钮调用 JavaScript 函数CapacityChart(),但该函数未正确执行。

第一种方法是直接在 HTML 中定义 onclick 事件处理程序element:

<input type="button" value="Capacity Chart" onclick="CapacityChart();">

但是,在 HTML 中定义事件处理程序有局限性。现代浏览器更喜欢使用 JavaScript 事件监听器来更好地组织和维护代码。

使用 JavaScript,您可以使用 addEventListener() 方法将事件监听器分配给按钮的 onclick 事件:

document.getElementById("buttonId").addEventListener("click", CapacityChart);

另一种选择是将匿名函数直接附加到 onclick 属性:

document.getElementById("buttonId").onclick = function() { CapacityChart(); };

您的问题CapacityChart() 函数可能位于其他地方。尝试使用以下代码来解决该问题:

CapacityWindow.document.open("text/html");
CapacityWindow.document.write(s);
CapacityWindow.document.close();

此外,为了确保跨浏览器兼容性,请将代码中的 document.all 的任何实例替换为 document.getElementById。

以上是如何从 HTML 按钮正确调用 JavaScript 函数?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn