首页 > 解决方案 > 使用来自用户输入的变量获取对象

问题描述

我一直在寻找这个问题的答案,但我还没有找到完全类似的问题。我创建了几个对象(ob0、ob1、ob2),它们都包含相同的条目。但在每个对象上,条目的值是不同的。即 ob0.brand 具有一个值,但 oj1.brand 具有不同的值。我想在网站上可视化 objs 的信息。有一个单选按钮根据选择的内容返回 ob0、ob1 或 ob2。在一个 div 类上,将显示条目值的文本内容。单选按钮值被命名为 var objSelc 并尝试使用文档选择器来显示 ojbSelc.brand 以便用户选择的任何内容都代表 obj0.brand 或 obj1.brand 等。但是,这会返回错误。也许它' s 不能使用 var 作为对象的名称吗?或者我会有什么解决方法?顺便说一句,我是 0.1 级的第一个月学习,任何帮助将不胜感激。这是有问题的代码片段:

例如,这里是自行车和不同组件、刹车片、轮胎、链条等的库存。我制作了不同的副本,但替换了内容信息。

 let UA = {
   brakes: "shimano b10s",
   backTire: " Bigben 26",
   frontTire: "bigben 20",
   bikeChain: " 1/32 single speed",
   motorBrand: " Bosch Intuvia, cargoline",
 };

let cargoCarla = {
   breaks: "shimano b10s",
   backTire: "big apple 24",
   frontTire: "big apple 20",
   bikeChain: "na",
   motorBrand: "na",
 };

这是来自 HTML 站点的单选按钮的一些用户输入

var form = document.querySelector("form");
var log = document.querySelector("#log");

 form.addEventListener(
  "submit",
  function (event) {
   var data = new FormData(form);
   var output = "";
   for (const entry of data) {
   output = output + entry[0] + "=" + entry[1] + "\r";
   }
   // log.innerText = output;
    event.preventDefault();
   var splitOut = output.split("=");
   var bikeSelc = splitOut[1].toString();
   showComponent.textContent = bikeSelc.brakes;
  },
  false
  );

事实上,bikeSelc 确实会根据选择产生 UA 或 cargoCarla。但是bikeSelc.brakes 不会产生结果,因此JS 在添加到.brake 时不会读取bikeSelc 的值。即使 consel.log 确实给出了正确的变量。

 showComponent.textContent = UA.brakes;

这只是我硬编码来看看它在 DOM 上的样子

标签: javascript

解决方案


推荐阅读