JavaFX:当我们构建html并在header中放置链接时，我们的javascript文件不工作.这是为什么?
JavaFX: Our javascript file is not working when we build the html and put the link in header. Why is this?
用户应该能够改变值和数字应该改变。这种情况下出了什么问题?也有可能链接的JS文件在html中运行在JavaFX的webView?
var numbersToChange;
var multiplier;
function pageLoad() {
var inputBox = Number(document.getElementById("servingInputBox").value);
multiplier = new Array();
numbersToChange = document.getElementsByClassName("numberToChange");
for (i = 0; i < numbersToChange.length; i++) {
multiplier[i] = Number(numbersToChange[i].innerHTML) / inputBox;
}
}
function changeNumbers() {
var inputboxValue = Number(document.getElementById("servingInputBox").value);
for (i = 0; i < numbersToChange.length; i++) {
numbersToChange[i].innerHTML = (Math.trunc((inputboxValue * multiplier[i]) * 10)) / 10;
}
}
function increase() {
var inputBox = Number(document.getElementById("servingInputBox").value);
document.getElementById("servingInputBox").value = (Math.trunc(inputBox * 10) + 10) / 10;
changeNumbers();
}
function decrease() {
var inputBox = Number(document.getElementById("servingInputBox").value);
var newNumber = (Math.trunc(inputBox * 10) - 10) / 10;
if (newNumber >= 0) {
document.getElementById("servingInputBox").value = newNumber;
changeNumbers();
}
}
function enter(e) {
if (e.keyCode == 13) {
var inputBox = Number(document.getElementById("servingInputBox").value);
document.getElementById("servingInputBox").value = Math.trunc(inputBox * 10) / 10;
changeNumbers();
}
}@font-face {
font-family: 'Archivo Black';
font-style: normal;
font-weight: 400;
src: local('Archivo Black Regular'), local('ArchivoBlack-Regular'), url(http://fonts.gstatic.com/s/archivoblack/v4/WoAoVT7K3k7hHfxKbvB6B6GwZwAVuVwqynDPq0VH9Ho.woff2) format('woff2'), url(http://fonts.gstatic.com/s/archivoblack/v4/WoAoVT7K3k7hHfxKbvB6B0BTuPGxyeV-VBVV8KqqzrI.woff) format('woff');
}
html,body{
margin:0 0 1px;
padding:0
}
input,textarea{
background-color:white
}
html{
overflow-y:scroll;
height:100%
}
body{
font-family:'Open Sans',sans-serif;
font-size:11px;
color:#202020;
line-height:14px;
position:relative;
padding-bottom:50px;
background-repeat:repeat-x;
background-position:0 -298px;
background-color:white
}
.nutritionLabel{
font-size:115% !important
}
@import url("//fonts.googleapis.com/css?family=Archivo+Black");
.nutritionLabel input.unitQuantityBox.ui-shadow-inset{
box-shadow:none
}
.nutritionLabel{
font-size:90%;
margin-bottom:1.1em;
padding:.68em;
color:#333;
font-family:Arial,Helvetica,sans-serif;
border:2px solid #000;
line-height:normal
}
.nutritionLabel .title{
line-height:.83em;
font-size:2.7em;
padding-bottom:4px;
font-family:'Archivo Black';
white-space:nowrap;
letter-spacing:-2px
}
.nutritionLabel .m{
font-size:.9em
}
.nutritionLabel .serving{
font-size:1.1em;
line-height:1.28em;
padding-bottom:2px
}
.nutritionLabel .name{
font-size:1.1em;
line-height:1.3em
}
.nutritionLabel .name.inline{
padding-top:.2em;
padding-top:.25em '9
}
.nutritionLabel .dvCalorieDiet,.nutritionLabel #calcDisclaimer{
font-size:.9em
}
.nutritionLabel .line{
border-top:1px solid #333;
padding:1px 0
}
.nutritionLabel .line.last{
border-bottom:1px solid #333
}
.nutritionLabel .line.indent{
margin-left:15px
}
.nutritionLabel .dv{
float:right
}
.nutritionLabel .dv:before{
content:''0000a0'
}
.nutritionLabel .bar1{
height:10px;
line-height:0;
font-size:1px;
background:#333
}
.nutritionLabel .bar2{
height:5px;
line-height:0;
font-size:1px;
background:#333
}
.nutritionLabel .dvCalorieDiet{
color:#777
}
.nutritionLabel .calorieNote{
padding:.60em 0 0 .70em
}
.nutritionLabel .star{
margin-left:-7px
}
.nutritionLabel .tblCalorieDiet th{
font-size:.7em;
border-bottom:1px solid #333;
text-align:left;
color:#777
}
.nutritionLabel .tblCalorieDiet{
width:100%
}
.nutritionLabel .tblCalorieDiet td{
padding:0;
line-height:normal;
font-size:.7em;
color:#777
}
.nutritionLabel .ar{
text-align:right
}
.nutritionLabel .fr{
float:right
}
.nutritionLabel .fl{
float:left
}
.nutritionLabel #calcDisclaimer{
color:#777
}
.nutritionLabel .spaceAbove{
height:10px
}
.nutritionLabel .setter{
width:12px;
padding:3px 0 0 0;
position:absolute;
left:0;
top:0;
z-index:100
}
.nutritionLabel .setter a{
display:block;
width:9px;
height:7px;
font-size:1px;
line-height:0em
}
.nutritionLabel a.unitQuantityUp{
padding-bottom:1px;
background:transparent url("up.png") left top no-repeat;
z-index:9999
}
.nutritionLabel a.unitQuantityDown{
padding-top:1px;
background:transparent url("down.png") left bottom no-repeat;
z-index:9999
}
.nutritionLabel input.unitQuantityBox{
width:25px;
height:22px;
padding:2px;
font-size:.9em !important;
margin-left:15px;
margin-bottom:0;
line-height:15px '9
}
.nutritionLabel input.unitQuantityBox.arrowsAreHidden{
margin-left:0
}
.nutritionLabel .rel{
position:relative
}
.nutritionLabel .servingSizeField{
float:left;
margin-top:.2em;
margin-bottom:.2em;
margin-right:.4em
}
.nutritionLabel .servingUnit{
float:left;
padding:0;
margin-top:.3em;
margin-bottom:.2em
}
.nutritionLabel .servingWeightGrams{
padding:0 0 0 .3em;
margin-top:.3em;
margin-bottom:.2em
}
.nutritionLabel .servingSizeText{
padding-right:.3em;
margin-top:.3em
}
.nutritionLabel .servingUnitQuantity{
margin-top:.3em;
padding-right:.3em
}
.cf:before,.cf:after{
content:" ";
display:table
}
.cf:after{
clear:both
}
.cf{
*zoom:1
}
.nutritionLabel .servingSizeText{
display:inline-block
}
.nutritionLabel .line{
line-height:normal;
}
.nutritionLabel .title{
padding-bottom:6px;
}<html>
<head>
</head>
<body onload="pageLoad()">
<div class="nutritionLabel" style="width: 283px;">
<div class="title">Nutrition Facts</div>
<div class="name">Ice Cream</div>
<div class="serving">
<div class="cf">
<div class="servingSizeText fl">Serving Size:</div>
<div class="rel servingSizeField fl">
<div class="setter">
<a href="javascript:increase()" class="unitQuantityUp" rel="nofollow"></a>
<a href="javascript:decrease()" class="unitQuantityDown" rel="nofollow"></a>
</div>
<input value="1" id="servingInputBox" class="unitQuantityBox" type="text" onkeypress="enter(event)">
</div>
<div class="servingUnit fl unitHasTextbox">pizza</div>
<div class="servingWeightGrams fl gramsHasTextbox">(853g)</div>
</div>
</div>
<div class="bar1"></div>
<div class="line m"><b>Amount Per Serving</b>
</div>
<div class="line">
<div class="fr">Calories from Fat <span class="numberToChange">740</span>
</div>
<div><b>Calories</b> <span class="numberToChange">2270</span>
</div>
</div>
<div class="bar2"></div>
<div class="line ar"><b>% Daily Value<sup>*</sup></b>
</div>
<div class="line">
<div class="dv"><b><span class="numberToChange">128</span></b>%</div><b>Total fat</b><span class="numberToChange"> 83</span>g</div>
<div class="line indent">
<div class="dv"><b><span class="numberToChange">190</span></b>%</div>Saturated Fat<span class="numberToChange"> 83</span>g</div>
<div class="dvCalorieDiet line">
<div class="calorieNote"><span class="star">*</span>Percent Daily Values are based on a 2000 calorie diet.</div>
</div>
</div>
</body>
</html>如果你有任何关于这个问题的知识，请帮助。
请在头部包含javascript文件。css也不加载我想。封头结构如下:
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>ABC</title>
<link rel="stylesheet" href="style/app.css"/>
<script src="js/app.js"></script></head>
同样，在你的HTML文件的路径上，为'style'和'js'创建文件夹，并以'app.css'和'app.js'的名称插入js和css文件。
相关文章：
- 为什么不'我们在javascript中使用函数参数的数据类型
- 我们如何使用css或JavaScript在i/j上更改句点(点）的颜色
- 我们可以用参数对象集合而不是原始数据来调用JavaScript collection.reduce(）方法吗
- 我们如何自定义排序JavaScript对象键
- 我们可以在javascript中使用函数作为返回语句吗
- 为什么可以'我们在函数体中为函数对象添加属性，就像在javascript中为对象文字添加属性一样
- 我们可以设置属性'id'到不同的'按钮'通过使用javascript或jquery的循环
- 我们可以在JavaScript函数中通过引用传递变量吗
- 为什么我们在javascript中使用Deferred(）
- UMD支持贯穿我们的JavaScript插件意味着
- 在 JavaScript 中，当我们实例化派生对象时，原型的函数隐藏在哪里
- 为什么我们使用Javascript事件
- 我们可以用来确保Javascript中精确精度的最大数字
- 我们是否有任何通用脚本/ jquery插件可以在通过ajax选项卡加载的内容上应用javascript
- 我们如何将URL的PDF转换为convert.javascript中的ToBase64String
- 我们如何捕捉移动设备“;下一个“;在Javascript中按键
- 我们可以在javascript中使用php变量，在php代码中使用javascript变量吗
- 当我们使用Javascript提交表单时，IsPostBack始终为True
- 我们可以在javascript url中传递GET变量吗
- 我们如何捕捉主文件中包含的javascript文件引发的错误
