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

我正在尝试为三种成分的配方创建一个单位转换计算器，但在点击“获取成分”按钮后无法运行计算。Firebug将getElementById行返回为null？JS:

$(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);
    }
}

HTML部分：

<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>  

你想做多少个黑巧克力花生酱杯子`



一杯黑巧克力片

一杯花生酱
一茶匙海盐

需要在

“按钮”

和

id

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

---

通过在变量周围加引号，可以将变量转换为字符串，因此无法用于计算：

乙二醇

应该是

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

还请注意以下行

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

将用值（dcTotal.toFixed（1））替换（“resultdc”）div中的所有内容

您应该将html更改为

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

一杯黑巧克力片

---

这将在span中填充所需的数字，而不会替换文本内容。

HTML似乎缺少javascript中引用的许多元素，如

#dc

，

#pb

，

#sea

等。感谢您的发现，修复了它…但仍返回“null”值。：（谢谢，也解决了这个问题。Firebug仍在报告一个错误：var dc=Number（document.getElementById（“dc”）.value）*.0333333；如null.like@adeneo所说-似乎没有id为“dc”、“pb”或“sea”的输入）在你的htmlI中列出，明白你的意思吗…程序是否在寻找这些变量作为单独的用户输入，比如我要的花生酱杯数？-如果是，我需要程序做的是从用户那里获取pbc输入，并使用这些信息来计算食谱需要多少巧克力、花生酱和盐…一个d在点击“获取成分”（或“计算”）按钮时返回该信息。是的，您需要输入以获取js中的值，或者在js中以编程方式进行（并删除获取输入值的要求）。然后应该是一个简单的问题，获取值，进行计算，然后显示结果。解决了它！一切正常。非常感谢大家的帮助！（：@gavgrif

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