引用错误文档未在javascript中定义

时间:2018-04-06 11:26:53

标签: javascript html

当我保存bill.js编辑器显示一些时,我使用括号编辑器 每个文档错误所需的输出都没有到来。

HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
    <title>split Bill</title>
    <link rel="stylesheet" type="text/css" href="normalize.css">
    <link rel="stylesheet" type="text/css" href="splitbill.css">
</head>

<body>
   <div id="container">
       <h1>Bill calculator</h1>
       <div id="calculator">
           <form>
               <label>
                   How Much your Bill ? <br>
            Rupees <input  type="text" id="billAmount">
               </label>
               <label>
                How was your Service sir?<br>
                <select id="serviceFeedback">
                    <option disabled selected value="0">
                        --Choose an option--
                    </option>
                    <option value="0.4">
                        40% -Very Good
                    </option>
                    <option value="0.3">
                        30% - Good
                    </option>
                    <option value="0.2">
                        20% - it was Ok
                    </option>
                    <option value="0.1">
                        10% - Bad
                    </option>
                    <option value="0.05">
                        5% - poor
                    </option>
                  </select>
               </label>
               <label>
                   How many people sharing the bill?<br>
                   <input type="text" id="totalpeople">
                   people
               </label>
               <button type="button" id="calculate">calculate!</button>
           </form>
       </div>
       <div id="totalTip">
           <sup>Rupees</sup><span id="tip">0.00 </span>
           <small id="each">each</small>
       </div>
   </div>

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

</body>
</html>

javascript在这里我没有在每个文档功能得到所需的输出有错误标志请告诉我我做什么我使用括号编辑器。 为什么我得到这个我使用 在HTML代码的末尾

//create function
function calculateTip() {

    var billAmount = document.getElementById("billAmount").value;
    var serviceFeedback = document.getElementById("serviceFeedback").value;

    var numpeople =document.getElementById("totalpeople").value;

    //validation
    if (billAmount =="" ||serviceFeedback == 0) {

        window.alert("please enter some value Boss!");
        return;
    }

    //if input is empty
    if (numpeople =="" ||numpeople <= 1) {
        numpeople =1;
        document.getElementById("each").style.display ="none";


    } else {
        document.getElementById("each").style.display ="block";

    }

    var total = (billAmount * serviceFeedback) / numpeople;
    total = Math.round(total * 100) / 100;
    total = total.toFixed(2);

    //display the  tip
    document.getElementById("totalTip").style.display = "block";
    document.getElementById("tip").innerHTML = total;
}

// hide tip amount

document.getElementById("totalTip").style.display ="none";
document.getElementById("each").style.display ="none";

//clicking the button  calls our custom function

document.getElementById("calculate").onclick=function()
{
    calculateTip();
}

1 个答案:

答案 0 :(得分:2)

在函数&#34; calculateTip&#34;我找到了这条线:

if (billAmount =="" || ServiceFeedback == 0) {

此处 ServiceFeedback 以大写字母而非小写字母开头。

您选择的选择字段的选项:

let selectElement = document.getElementById("serviceFeedback");
let serviceFeedback = selectElement.option[selectElement.selectedIndex].value;

在html文件中我发现了另一个问题:

<input type="text" id="totalpeople ">

id的末尾有空白!更好的是:

<input type="text" id="totalpeople">

在javascript文件中还有一个空白:

document.getElementById("each").style.display = " none";

更好的是:

document.getElementById("each").style.display = "none";

我希望有所帮助。

ReferenceError:文档未定义我发现: ReferenceError: document is not defined (in plain JavaScript)

=&GT;我的问题是:

  1. bill.js包含什么?
  2. calculateTip()在哪里调用?
  3. 我的意思是:在创建文档之前,是否可以像 document.getElementsBy ... 那样进行调用?