Firebug正在返回：document.getElementById（...）为空 - 我做错了什么？

我正在尝试为三种成分配方创建一个单位转换计算器，但无法通过点击“获取配料”按钮来运算计算结果。 Firebug将getElementById行作为null返回？ JS：HTML的Firebug正在返回：document.getElementById（...）为空 - 我做错了什么？

$(function(){ 
    $('#tabs').tabs(); 
}); 

window.onload = init; 

function init(){ 

document.getElementById("calc").onclick=function(){ 

    var pbc=Number(document.getElementById("pbc").value); 

    var dc=Number(document.getElementById("dc").value)* .0333333333;  
    var pb=Number(document.getElementById("pb").value)* .0166666667;  
    var sea=Number(document.getElementById("sea").value)* .0020833333; 
    var dcTotal= ("dc" * "pbc"); 
    var pbTotal= ("pb" * "pbc"); 
    var seaTotal= ("sea" * "pbc"); 
    document.getElementById("resultdc").innerHTML=dcTotal.toFixed(1); 
    document.getElementById("resultpb").innerHTML=pbTotal.toFixed(1); 
    document.getElementById("resultsea").innerHTML=seaTotal.toFixed(1); 
    } 
}

部分：

<form action="javascript:void(0)"> 
    <label for="pbc">How many Dark Chocolate Peanut Butter Cups would you like `to make?</label>` 
    <input type="text" name="pbc" id="pbc"> 
    <br><br> 
    <input type="button"id="calc" value="Get Ingredients"> 
    </form> 

    <p id="resultdc"> Cup(s) of Dark Chocolate Chips</p> 

    <p id="resultpb"> Cup(s) of Peanut Butter</p> 

    <p id="resultsea"> Teaspoon(s) of Sea Salt</p>

来源

2016-02-28 Lauren Marie

的HTML似乎缺少了不少在JavaScript中引用的元素，比如'＃dc'，'＃pb'，'＃sea'等 – adeneo

之间的空间通过把周围的变量报价，你AR econverting它们转换为字符串，因此不能够用于计算：

例如

var dcTotal= ("dc" * "pbc"); 
var pbTotal= ("pb" * "pbc"); 
var seaTotal= ("sea" * "pbc");

应该

var dcTotal= (dc * pbc); 
var pbTotal= (pb * pbc); 
var seaTotal= (sea * pbc);

也注意到以下行

document.getElementById("resultdc").innerHTML=dcTotal.toFixed(1);

将取代（ “resultdc”）DIV的所有内容，与值（dcTotal.toFixed（ 1））

你应该改变你的html到类似..

<p><span id="resultdc"></span> Cup(s) of Dark Chocolate Chips</p>

将所需的数字填写到跨度中，而不是替换文本内容。

来源

2016-02-28 23:23:34 gavgrif

谢谢，解决这个问题。 Firebug仍然报错： var dc = Number（document.getElementById（“dc”）。value）* .0333333333; as null。 –

like @adeneo said - 似乎没有与您的HTML – gavgrif

中列出的“dc”，“pb”或“海”id的输入我明白你的意思......是程序寻找这些变量作为单独的用户输入，如我要求的花生酱杯的数量是多少？ - 如果是这样，我需要的程序是从用户那里获得pbc输入，并使用该信息来计算配方要求的巧克力，花生酱和盐的量...并在返回该信息时按下'获取成分'（或'calc'）按钮 –

需要"button"和id

<input type="button" id="calc" value="Get Ingredients">

来源

2016-02-28 23:15:52

谢谢你发现，固定的...但'null'值仍然被返回。 :( –

Firebug正在返回：document.getElementById（...）为空 - 我做错了什么？

回答

相关问题