在 onClick 上运行嵌入在页面中的 javascript
Posted
技术标签:
【中文标题】在 onClick 上运行嵌入在页面中的 javascript【英文标题】：Run the javascript embedded within page upon onClick 【发布时间】：2017-08-05 17:01:47 【问题描述】：对不起，如果这个问题听起来很愚蠢；
我的情况是我的 html 中有三个输入滑块；然后，在<body> 标记中，在输入之后，我有一些javascript 访问数据。不幸的是，我希望嵌入式 JavaScript 通过onClick 事件运行；但是，嵌入式 JavaScript 并不是一个大功能，所以我很困惑。有人有解决方案吗？这是我的代码：
<html>
<body>
<form>
</form>
<form>
<input type="range" id="ocAc"></input>
<input type="range" id="ocBc"></input>
<input type="range" id="ocCc"></input>
</form>
<script>
var oc1 = document.getElementById("ocAc").value / 100;
var oc2 = document.getElementById("ocBc").value / 100;
var oc3 = document.getElementById("ocCc").value / 100;
var total = oc1+oc2+oc3;
//do stuff
</script>
【问题讨论】：
考虑发布您的代码，在您发布您的代码和您的努力之前，没有人可以帮助您。.. 请查看how-to-ask页面了解如何提问。 编辑这篇文章并添加你的代码。 添加了代码，如果需要更多请告诉我。onClick 事件在什么元素上？
【参考方案1】：
这是你想要的吗？
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<form>
<input type="range" id="ocAc" min="100" max="500" step="10" />
<input type="range" id="ocBc" min="100" max="500" step="10" />
<input type="range" id="ocCc" min="100" max="500" step="10" />
<br />
<button id="myButton">Calculate</button>
<input type="text" id="myInput" />
</form>
<script>
function modifyText(event)
event.preventDefault();
var oc1 = document.getElementById("ocAc").value;
var oc2 = document.getElementById("ocBc").value;
var oc3 = document.getElementById("ocCc").value;
var total = oc1 + oc2 + oc3;
document.getElementById('myInput').value = total;
;
// add event listener for button.
var el = document.getElementById("myButton");
el.addEventListener("click", modifyText, false);
</script>
</body>
</html>
【讨论】：
哇！奇迹般有效。非常感谢。以上是关于在 onClick 上运行嵌入在页面中的 javascript的主要内容，如果未能解决你的问题，请参考以下文章