Question

我试图编写一个对某些复选框做出反应的计算器。服务大小将乘以下表中的不同值，具体取决于勾选的方框。例如，在ThickChiaYogurt表中，＆＃39; Thick＆＃39;选择一致，＆＃39; Chia＆＃39;选中了复选框，并且“酸奶”＃39;选中了复选框。

我遇到的问题是，我似乎无法用价值观做任何事情。

这里是选择框代码的样子：

<p>
<label style="font-family: arial" for="textfield">Serving Size (ml):</label>
<input type="text" name="textfield" id="ServingSize"> <?p>
<table width="250">
 <tr>
<td><label style="font-family: arial">
  <input type="checkbox" name="Settings" value="ChiaUsed" id="Chia">
  Use Chia Seeds?</label></td>
 </tr>
 <tr>
  <td><label style="font-family: arial">
    <input type="checkbox" name="Settings_" value="YogurtUsed" id="Yogurt">
     Use Yogurt?</label></td>
  </tr>
 <tr>
  <td><label style="font-family: arial">
      <input type="checkbox" name="Settings_" value="ProteinUsed" id="Protein">
  Use Protein / Choc powder?</label></td>
 </tr>
<p style="font-family: arial"> Consistency: <select><option>Thick</option>
 <option>Medium</option>
   <option>Runny</option></select> </p>

我将使用的信息反对它：

var ThickChiaYogurt = [0.1, 0.38, 0.036, 0.43]
  var MediumChiaYogurt = [0.1, 0.42, 0.036, 0.39]
  var RunnyChiaYogurt= [0.08, 0.46, 0.036, 0.35]

  // var NO CHIA = [ OATS, MILK, GREEK ]
  var ThickYogurt = [0.15, 0.38, 0.45]
  var MediumYogurt = [0.1, 0.42, 0.41]
  var RunnyYogurt = [0.08, 0.46, 0.37]

  // var NO GREEK = [ OATS, MILK, CHIA ]
  var ThickChia = [0.23, 0.58, 0.036]
  var MediumChia = [0.18, 0.61, 0.36 ]
  var RunnyChia = [0.16, 0.64, 0.03 ]

  // var NO GREEK OR CHIA = [ OATS, MILK ]
  var Thick = [0.25, 0.6]
  var Medium = [0.22, 0.63]
  var Runny = [0.2, 0.65]

var Serving = 111
// OATS MILK GREEK CHIA POWDERS
var Output = [0, 0, 0, 0, 0]

function myFunction(Thick, Serving) {
return Thick[0] * Serving;              }

我愚蠢吗？这是我使用JavaScript的第一天，所以我觉得我的头撞到了墙上。

我希望它能告诉用户他们在写完他们想要的服务量之后应该使用的每种成分有多少，并勾选相关方框。

谢谢！

Answer 1

您需要为每个输入框添加一个onclick事件处理程序，如下所示。

<input type="checkbox" name="Settings" onclick="myFunction(this)" value="ChiaUsed" id="Chia">

然后在你的myFunction函数中，

function myFunction(element){
  //use element object here
}

您将收到元素数据。您可以访问＆＃34; value＆＃34;等属性。用点符号或括号表示法

var value = element.value;

根据复选框运行功能

1 个答案: