为了账号安全,请及时绑定邮箱和手机立即绑定

如何通过使用带有 java 脚本的数组来获取每个值?

如何通过使用带有 java 脚本的数组来获取每个值?

holdtom 2022-06-05 16:11:57
我想从数组中获取每个值,当我选择或检查每个值时,我只想获取一个值。但是有一些错误,我不知道如何修复它。我该如何解决它才能正常工作?请告诉我。谢谢var pzArray = [];function pizzaOrder() {  var orderList = {    pizzaName:"",    size:"",    topping:""  };  orderList.pizzaName = document.getElementById("pzName").value;  orderList.size = document.getElementByName("pzSize").value;  orderList.topping = document.getElementById("topping").checked;  pzArray.push(orderList);  for (var i = 0; i<pzArray.length; i++) {    var pizza = pzArray[i];    invoice = pizza.size + pizza.pizzaName + pizza.topping;    totalInvoice += invoice + "<br>"  }  document.getElementById("showList").innerHTML = totalInvoice;}   <body><div>    <input type=radio id="pzName" name=pzSelect value="A">a    <input type=radio id="pzName" name=pzSelect value="B">b    <input type=radio id="pzName" name=pzSelect value="C">c    <br><br>    <select>        <option name="pzSize" id="small" value="Small">S        <option name="pzSize" id="medium" value="Medium">M        <option name="pzSize" id="large" value="Large">L    </select>    <br><br>    <input type="checkbox" id="topping" name="ExtraCheese" value="Extra Cheese">XtraC    <input type="checkbox" id="topping" name="Pepperoni" value="Pepperoni">P    <input type="checkbox" id="topping" name="Mushrooms" value="Mushrooms">M    <br><br>    <input type=button value="Order Description" onClick="pizzaOrder()" /></div><span id="showlist"><span></span></body>
查看完整描述

2 回答

?
ABOUTYOU

TA贡献1812条经验 获得超5个赞

有几个错误没有在你设置的字符串中设置名称,name=pizSelect而不是name="pizSelect"在 ids 中输入错误,没有初始化totalInvoicewith var 或 let 并且在 forloop 中缺少条件 i<pzArray.length。


至于单选按钮,你可以做得到document.querySelector("input[name=pzSelect]:checked").value 的价值


var pzArray = [];

function pizzaOrder() {

 document.getElementById("showlist").innerHTML

  var orderList = {

    pizzaName:"",

    size:"",

    topping:""

  };

  orderList.pizzaName = document.querySelector("input[name=pzSelect]:checked").value;

  orderList.size = document.getElementById("psize").value;

  let toppings=document.querySelectorAll("input[name=topping]:checked");

  toppings.forEach( (topping)=> orderList.topping+=topping.value+"," ) ;

  let totalInvoice="";

  pzArray.push(orderList);

  for (let i = 0; i< pzArray.length; i++) {

    let pizza = pzArray[i];

    invoice = `Order number : ${i+1} ${pizza.size} ${pizza.pizzaName} with ${pizza.topping}`;

    totalInvoice += invoice + "<br>"

  }

  document.getElementById("showlist").innerHTML = totalInvoice;

}

<h4>Order Pizza</h4>

<div>

    <!-- in your code you have not included pzSelect in " " -->

    <input type=radio id="pzName" name="pzSelect" value="Chicago">Chicago Pizza

    <input type=radio id="pzName" name="pzSelect" value="Sicilian">Sicilian Pizza

    <input type=radio id="pzName" name="pzSelect" value="Detroit">Detroit

Pizza    <br><br>

    Size

    <select id="psize">

        <option name="pzSize" id="small" value="Small">Small

        <option name="pzSize" id="medium" value="Medium">Medium

        <option name="pzSize" id="large" value="Large">Large

    </select>


    <br><br>


    <input type="checkbox" id="topping" name="topping" value="Extra Cheese">XtraC

    <input type="checkbox" id="topping" name="topping" value="Pepperoni">Pepporni

    <input type="checkbox" id="topping" name="topping" value="Mushrooms">Mushrooms


    <br><br>


    <input type=button value="Order Description" onClick="pizzaOrder()" />


</div>


<span id="showlist"><span>


查看完整回答
反对 回复 2022-06-05
?
吃鸡游戏

TA贡献1829条经验 获得超7个赞

正确初始化您的 orderList 对象。首先作为一个空对象:


var orderList = {};

// then adding the attributes

orderList.pizzaName = document.getElementById("pzName").value;

orderList.size = document.getElementByName("pzSize").value;

orderList.topping = document.getElementById("topping").checked;

或直接初始化对象属性


var orderList = {

    pizzaName = document.getElementById("pzName").value,

    size = document.getElementByName("pzSize").value,

    topping = document.getElementById("topping").checked

}


查看完整回答
反对 回复 2022-06-05
  • 2 回答
  • 0 关注
  • 107 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信