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

如何使用for循环设置另一个对象的属性值?

如何使用for循环设置另一个对象的属性值?

长风秋雁 2023-10-10 15:18:00
我在设置对象属性值时遇到了一个大问题(对我来说这是一个大问题)。我有一个这样的对象:const newPlan = {    name: '',    description: '',    number: '',    monday: {        breakfast: '',        secondBreakfast: '',        soup: '',        secondMeal: '',        supper: '',    }};键的值取决于用户输入。设置前 3 个值很容易,但我对对象值中的对象有问题,我必须用于此循环。有这样的 HTML:<tr>  <td>PONIEDZIAŁEK</td>  <td>    <input list="monday-breakfast" id="monday-1">    <datalist id="monday-breakfast">    </datalist>  </td>  <td>    <input list="monday-second-breakfast" id="monday-2">    <datalist id="monday-second-breakfast">    </datalist>  </td>  <td>    <input list="monday-soup" id="monday-3">    <datalist id="monday-soup">    </datalist>  </td>  <td>    <input list="monday-second-meal" id="monday-4">    <datalist id="monday-second-meal">    </datalist>  </td>  <td><input list="monday-supper" id="monday-5">    <datalist id="monday-supper">    </datalist></td></tr>和我的js:newPlan.name = planName.value;newPlan.description = planDescription.value;newPlan.number = planWeekNumber.value;for (let i = 0; i < Object.keys(newPlan.monday).length; i++) {    for (let j = 0; j < allDays.length; j++) {        Object.values(newPlan.monday)[i] = 'abc';        break    }}'abc' 值只是例如 - 我想根据输入列表值设置值,该值基于用户选择的值。所以有<input list="monday-breakfast">等等,并且来自该输入的每个值都应该是正确的键值。最后它应该像这样:const newPlan = {    name: 'some string from input',    description: 'some string from input',    number: 'some string from input',    monday: {        breakfast: 'some string from input list',        secondBreakfast: 'some string from input list',        soup: 'some string from input list',        secondMeal: 'some string from input list',        supper: 'some string from input list',    }};
查看完整描述

1 回答

?
泛舟湖上清波郎朗

TA贡献1818条经验 获得超3个赞

newPlan.monday您需要使用 an循环遍历 的条目index,以便可以将 current 的值设置key为适当的元素值。在本例中为monday-index(monday-1)。


这是一个例子:


const newPlan = {

  name: '',

  description: '',

  number: '',

  monday: {

    breakfast: '',

    secondBreakfast: '',

    soup: '',

    secondMeal: '',

    supper: '',

  }

};


let index = 1;


newPlan.name = document.getElementById('planName').innerHTML;

newPlan.description = document.getElementById('planDescription').innerHTML;

newPlan.number = document.getElementById('planWeekNumber').innerHTML;


for (let [key, value] of Object.entries(newPlan.monday)) {

  newPlan.monday[key] = document.getElementById(`monday-${index}`).value;

  index++;

}


console.log(newPlan);

<tr>

  <td>PONIEDZIAŁEK</td>

  <div id="planName">Plan 1</div>

  <div id="planDescription">Tasty food.</div>

  <div id="planWeekNumber">1</div>

  <td>

    <input list="monday-breakfast" id="monday-1" value="Ham and eggs">

    <datalist id="monday-breakfast"></datalist>

  </td>

  <td>

    <input list="monday-second-breakfast" id="monday-2" value="Cereal">

    <datalist id="monday-second-breakfast"></datalist>

  </td>

  <td>

    <input list="monday-soup" id="monday-3" value="Meat soup">

    <datalist id="monday-soup"></datalist>

  </td>

  <td>

    <input list="monday-second-meal" id="monday-4" value="Hamburger">

    <datalist id="monday-second-meal"></datalist>

  </td>

  <td>

    <input list="monday-supper" id="monday-5" value="Toast">

    <datalist id="monday-supper"></datalist>

  </td>

</tr>


查看完整回答
反对 回复 2023-10-10
  • 1 回答
  • 0 关注
  • 45 浏览

添加回答

举报

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