如何从json设置多个选择值-解网

问：

作为 Web 开发中的乞丐，我只是问一个关于使用 jQuery 从 json 设置多个选择选项的问题：这是我的选择

首先是颜色

<select name="attr[]" class="form-control" id="attrColor"><option value="0">--Select</option><option value="1">Red</option><option value="2">Green</option><option value="3">Yellow</option></select>

第二个是尺寸

<select name="attr[]" class="form-control" id="attrSize"><option value="0">--Select</option><option value="4">Small</option><option value="5">Medium</option><option value="6">Large</option></select>

JSON数据如下：- [{"attribute":"Color","valueID":"1","value":"Red"},{"attribute":"Size","valueID":"4","value":"Small"}]

我只需要一个代码片段来设置 #attrColor 中的颜色和 #attrSize 中设置大小，两者都选择在同一页面和同一个容器中。

我将非常感激和有义务。谢谢

我是一个乞丐，我只是想有人帮助我

HTML jQuery JSON

// Your JSON data
const jsonData = [
  {"attribute":"Color","valueID":"1","value":"Red"},
  {"attribute":"Size","valueID":"4","value":"Small"}
];

// Loop through the JSON data
jsonData.forEach(item => {
  const attributeName = item.attribute;
  const selectedValue = item.valueID;

  // Find the corresponding <select> element by its ID
  const $select = $(`#attr${attributeName}`);

  // Set the selected option
  $select.val(selectedValue);
});

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<select name="attr[]" class="form-control" id="attrColor"><option value="0"></option><option value="1">Red</option><option value="2">Green</option><option value="3">Yellow</option></select>
<select name="attr[]" class="form-control" id="attrSize"><option value="0">--Select</option><option value="4">Small</option><option value="5">Medium</option><option value="6">Large</option></select>

请确保在项目中包含 jQuery，以便此代码正常工作，因为它使用 jQuery 选择器和方法。

此代码将遍历您的 JSON 数据，通过将属性名称附加到“attr”来查找相应的元素，并根据 JSON 数据中的 valueID 设置所选选项。

上一个：遍历 get_posts 以创建嵌套的多维数组和 JSON

下一个：使用多级 JSON 数据创建 HTML 表格

如何从json设置多个选择值

How to set multiple select otion values from json

评论