我正在尝试将外部JS文件链接到我的HTML，并让提交表单在同一页面上显示信息。我将在我的HTML下面包含JS文件。
<!doctype html>
<html lang="en">
<head>
<title>Contact Me</title>
<meta charset="utf-8" />
<meta name="description" content="Rob Nelson's Resume Website">
<meta name="robot" content="noindex, nofollow">
<!-- JavaScript functions will go here -->
<script src="script.js"></script>
<!-- noindex tells the search engine not to archive my page in the search engine
nofollow tells the robot it should not continue to crawl other pages referenced in the hypertext links on the page-->
<!-- prgWebPage.html - My Resume Site
Course: CSC 135
Project Name: prjMenu
Written by: Rob Nelson
Written: 4/2/17
Revised: 4/6/17
-->
<link href="style.css" rel="stylesheet" type="text/css">
<!-- CSS codes will go here -->
<style type="text/css"></style>
</head>
<body>
<div id="wrapper">
<header id="top_of_the_page">
<div id="skip"><a href="#content">Skip to main content</a></div>
<h1>Rob Nelson</h1>
<!-- Call the JavaScript functions here -->
<nav class="main menu">
<h1>
<a href="index.html"><span>Home</span></a>
<a href="clientSpec.html"><span>My Color Scheme</span></a>
<a href="myWork.html"><span>My Work</span></a>
<a href="myMusic.html"><span>My Music</span></a>
<a href="faveFilm.html"><span>A Few of My Favorite Films</span></a>
<a href="faveGroup.html"><span>Fave Artist</span></a>
<a href="disability.html"><span>Disabilities</span></a>
<a href="contact.html"><span>Contact</span></a>
</h1>
</nav>
</header>
<br>
<br>
<br>
<h1 title="This is a contact page for my resume site">Contact me Below</h1>
<form>
<fieldset>
<legend>Contact Me</legend>
<label> What is your first name:
<input type="text" name="txtFirstName" id="firstName" maxlength="15" value="Rob" placeholder="Type first Name here" />
</label>
<br>
<label>What is your last name:
<input type="text" name="txtLastName" id="lastName" maxlength="15" value="Nelson" placeholder="Type last Name here" />
</label>
<br>
<label>What is your email:
<input type="email" name="txtEmail" id="txtEmail" maxlength="50" value="youremail@gmail.com" placeholder="Type email here" required>
</label>
<br>
<label>What is your phone number:
<input type="text" name="txtNumber" id="phoneNumber" value="651-***-****" placeholder="Type phone number here" />
</label>
<br>
</fieldset>
</form>
<main id="content">
<form>
<fieldset>
<legend>Subscirbe to the New Lens Newsletter?</legend>
<label>Yes
<input type="radio" name="optYes" id="optYes" value="Yes">
</label>
<br>
<label>No
<input type="radio" name="optNo" id="optNo" value="No">
</label>
</fieldset>
</form>
<form>
<select id="lstMe">
<option value="Mentoring">Learn more about Mentoring</option>
<option value="Educational">Connect about Educational matters</option>
<option value="Professional">Connect about Professional matters</option>
</select>
<button type="submit" name="btnSubmit" id="btnsubmit" value="Submit Form" onClick="displayMsg();">Submit Form</button>
<div id="return">
<!-- Set up a placeholder to display the results -->
<span id="message"></span>
</div>
<h3>What is the Difference between HTML,CSS, and JavaScript?</h3>
<p>HTML is the script. It just contains the words the performing artists should state. CSS places the performing artists in their beginning positions and dresses them in different ensembles. JavaScript moves the performing artists from their unique positions to new positions, modifies the ensembles so they look not quite the same as the way they looked when the play began. It can even retroactively modify the script. Fundamentally, it can take all the "chess pieces" laid out by the HTML and CSS and play with them, rearranging them, evolving them, and so on. JavaScript can likewise speak with both the group of onlookers and the back-stage team. On the off chance that somebody in the crowd needs one of the performers to bite the dust with the goal that his understudy can have his spot, JavaScript will deal with that. On the off chance that somebody backstage needs the drapery to descend. JavaScript will deal with that, as well.</p>
</form>
</main>
</div>
</body>
</html>
这是我的JS代码.....
/* script.js - external JavaScript file for contact.html
Rob Nelson
Written: 4-22-16
Revisions:
*/
/* ==============================
displayMsg( ) - Get input from the user.
Save it in a variable.
Use it to display a message on the screen.
================================= */
function displayMsg()
{
var txtFirstName = "";
var txtLastName = "";
var txtEmail = "";
var txtNumber = "";
var placeholder;
txtFirstName = document.getElementById("firstName").value;
txtLastName = document.getElementById("lastName").value;
txtEmail = document.getElementById("txtEmail").value;
txtNumber = document.getElementById("phoneNumber").value;
/* this wraps the message in an invisible div, and displays it when the button is clicked */
placeholder = document.getElementById("return");
response.style.display = 'block';
placeholder.innerHTML = "Hello " + txtFirstName + " " + txtLastName + ", I will email you at: " + txtEmail + " or call you at: " + txtNumber;
}
function clearMsg(){
var placeholder;
placeholder = document.getElementById("return");
response.style.display = 'none';
}
;
提前感谢您的帮助。我之前尝试过发布这个问题，我已经通过在我的HTML中包含div id = return来对我的JS上的占位符进行了更改，但它仍然无效。