Question

我正在尝试为简历页面制作工资计算器。我的功能在其内部工作时，然而，当我将其更改为外部我的按钮和功能不起作用。我试图在中心div中执行此操作。忽略其他页面部分，因为这些只是链接非常感谢任何帮助！

这是我的HTML：

  <!DOCTYPE html>
 <html>

 <!--External-->

 <head>


<title>Resume of Michael R. Young </title>
<link rel = "stylesheet" href = "michaelyoung.css"/>
<script type="text/javascript" src="work.js"></script>
</head>


<body>

<div>
 <h1><img src="Banner.jpeg" alt="Banner" style="width:750px;height:100px;"> </h1> 

 <div class = 'main'> <!-- Main gray div -->
 <h4> Wage Calculator</h4>
  <!--border-->
 <div class = 'left' > <!-- Left div -->
  <p> Other pages </p>
  <p><a href="School.html"  title="Schools I have attended."> School</a></p>
  <p><a href="Contact.html" title="Contact information">Contact</a></p>
  <p><a href="Awards.html" title="Awards I've receieved.">Awards</a></p>
  <p><a href="Degrees.html" title="Years and Degrees earned.">Degrees</a></p>

</div>


 <div class = 'center'> <!-- Center div Took out inline but not working-->
 <h3> Salary calculator</h3>



<p> Enter wage per hours: <input type="text" id="textOne" /></p>
<p> Enter hours per week: <input type="text" id="textTwo" /></p>


<input type="button" onclick="getText()" value="Check" />
<p id="change"></p>


</div>



  </div>
  </div>

</body>
</html>`

我的javascript：

     <script>

function getText(){

  //access the element with the id 'textOne' and get its value
  //assign this value to the variable theText
  var theText = document.getElementById('textOne').value;

  //alert("Your Hourly Wage is: " + theText);

var hours= document.getElementById('textTwo').value;
//alert("Your hours per week is: " + hours);



var hourlywage=document.getElementById('textOne').value;//saving in hourlywage

var hoursWorked=document.getElementById('textTwo').value;//saving in hoursWorked


var wage = parseInt(hourlywage);//changing to INT
//document.write(wage);
var hours = parseInt(hoursWorked);//changing to INT
//document.write(hours);

var totalpay= (wage * hours)*52;

if(totalpay<20000)
{
    document.getElementById("change").innerHTML ="Yearly salary of: $"+totalpay +" is too low thank you!";

}
else if(totalpay>20000 && totalpay<25000)
{
document.getElementById("change").innerHTML ="Yearly salary of: $"+totalpay +" is close lets negotiate!";
}
else
{
document.getElementById("change").innerHTML ="Yearly salary of: $"+totalpay + " is just right!"
}


//document.write(totalpay);


}

</script>

Answer 1

您需要将js移动到页面底部：

 ....
 </div>
 <script type="text/javascript" src="work.js"></script>

</body>
</html>`

外部JS文件按钮调用

1 个答案: