繁体   English   中英

如何从外部JS文件中调用onClick按钮,一个function

[英]how to call onClick button, a function from external JS file

我正在使用 JS 和 HTML 做我的第一步,我正在尝试制作一个用于平方数字的页面,在第一个框中我输入一个数字,第二个是空白的,我单击按钮,我想要结果之前输入的数字出现在第二个框中,function 是从外部 js 文件加载的,谁能解释一下怎么做?

HTML代码

<html>

<head>
<title>Tytuł strony</title>
<link rel="stylesheet" href="styl.css" type="text/css" />

</head>

<body>
<section>
    <h2>Skrypt do potęgowania liczb</h2><br> 
Podaj liczbę którą podniesiemy do kwadratu:<br>
<input type="text" id="Liczba" value="" placeholder="Liczba" /><br>
<input type="text" id="Wynik" value="" placeholder="Wynik" /> 
<button type="button" id="Przycisk" onclick="Potegowanie(Liczba, Wynik)" >Oblicz</button><br>

</section>
<script type="text/javascript" src="script.js"></script>
</body>

</html>

JS代码

<script type="text/javascript">
function Potegowanie(pole_na_liczbe, pole_na_wynik)
{
var liczba = document.getElementById("pole_na_liczbe").value;
var wynik = liczba*liczba;
pole_na_wynik.value = wynik;
}
</script>

要获取第一个值,您可以使用document.getElementById(); 方法,并引用您的第一个输入框的 id,例如...

var liczba = document.getElementById("Liczba").value;

...然后在您完成计算后,您可以使用类似的方法将值分配给您的第二个输入框...

document.getElementById("Wynik").value = wynik

总而言之,它看起来像这样......

 function Potegowanie() { var liczba = document.getElementById("Liczba").value; var wynik = liczba*liczba; document.getElementById("Wynik").value = wynik }
 <html> <head> <title>Tytuł strony</title> <link rel="stylesheet" href="styl.css" type="text/css" /> <script type="text/javascript" src="script.js"></script> </head> <body> <section> <h2>Skrypt do potęgowania liczb</h2><br> Podaj liczbę którą podniesiemy do kwadratu:<br> <input type="text" id="Liczba" value="" placeholder="Liczba" /><br> <input type="text" id="Wynik" value="" placeholder="Wynik" /> <button type="button" id="Przycisk" onclick="Potegowanie()" >Oblicz</button><br> </section> </body> </html>

额外的指针...在 JavaScript 中,我们使用驼峰式命名变量、id 和函数,因此您的 function Potegowanie()例如最好被称为potegowanie() 它仍然可以正常工作,但这只是一种很好的做法。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM