Javascript初学者试图将其连接到HTML

Beginner at Javascript trying to connect it to HTML

本文关键字：连接 HTML 初学者 Javascript      更新时间：2023-09-26

所以我一直在尝试从我的HTML文件中的两个输入框中添加两个数字，并在第三个输入框中显示答案。

这是我的Javascript代码 
var x;
var y;
 function Add() 
 {
     x = document.getElementById("input1").value;
     y = document.getElementById("input2").value;
document.getElementById("answerswer").value = x + y
}
这是我的HTML文件的代码， 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="C:'Users'*****'Desktop'Projects'Math Website'Math.css" />
<link href="Math.css" rel="stylesheet" type="text/css" />
<script src="C:'Users'*****'Desktop'Projects'Math Website'Maths.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<p>Hello</p>
<input type="text" id="input1">
<p>+</p>
<input type="text" id="input2">
<button  onclick="Add()" >Get Value</button>
<input type="text" id="answerswer">
</body>
  >  </html>

基本上通过一些帮助，我摆脱了所有的语法错误，但它似乎仍然无法将两个数字相加?有人能帮我吗?还有谁能给我一些关于链接Javascript与HTML更一般的建议?

在javascript中，"+"用于连接字符串

和document.getElementById("id").value返回的值总是返回一个string

所以为了应用真正的"+"运算你必须把这些字符串转换成整数

，这可以用parseInt来完成。

还有其他可用的如parseFloat来添加浮点数

document.getElementById("answerswer").value = parseInt(x) + parseInt(y)

纠正你的js代码并解析它。

function Add() 
 {
     x = document.getElementById("input1").value;
     y = document.getElementById("input2").value;
     document.getElementById("answerswer").value = parseInt(x) + parseInt(y);
}

也许你应该看看在codeacademy.com这样的网站上做一个web开发初学者课程基本的问题来自于跳过而不涉及基础知识或错误的练习。这至少不仅涵盖了这一次，也涵盖了下次。

相关文章：