防止Javascript对JSON重新排序

我有两个JSON映射：

{
  "1000006": "Alternate Business Phone",
  "1000008": "Alternate Home Phone",
  "1000001": "Business Phone",
  "1000003": "Clinic Phone",
  "3": "Facsimile",
  "1000007": "Home Phone",
  "1000004": "Lab Phone",
  "4": "Pager",
  "1000002": "Secure Msg Phone"
}

及

这些是按值字母顺序排列的键值映射。我使用这两个选项根据另一个下拉菜单的选定项更改下拉菜单的内容。图片说明：

所选电话：

所选电子邮件：

但是，正如您在图像中看到的，列表项的顺序没有被保留

我处理列表项的Javascript如下所示：

  var options_1 = {"1000006":"Alternate Business Phone","1000008":"Alternate Home Phone","1000001":"Business Phone","1000003":"Clinic Phone","3":"Facsimile","1000007":"Home Phone","1000004":"Lab Phone","4":"Pager","1000002":"Secure Msg Phone"};
  var options_2 = {"6":"Business Email","1000005":"Deliver To Email","7":"Personal Email"};
  function changePhoneEmailItems()
  {
    var selectedItem = document.getElementById("addNewCategory").value;
    var options;
    if('1' === selectedItem) {
        options = options_1;
    } else {
        options = options_2;
    }
    var list = document.getElementById("addNewUsageType");
    list.options.length=0;
    for(var i in options) {
        list.add(new Option(options[i], i));
    }
  }

根据，我需要更改我使用的数据结构，因为根据定义，JSON是无序的

我尝试将JSON更改为新映射：

但它抛出了一个错误：

TypeError: options_1 is not iterable

如何更改JSON对象以保持原始顺序

注意：我的JSON来自一个Spring控制器，它用JSON包装映射以发送到视图。但是，如果有更合理的方法将贴图从控制器传输到视图，我可以修改控制器

编辑： 为了更好地衡量，生成JSON的控制器代码是：

for(int i = 1; i <= 2; i++) {
    JsonObject json = new JsonObject();
    HashMap<String, String> CDCONTMETHTP = (HashMap<String, String>)model.get("CDCONTMETHTP_" + i);
    for(Entry<String, String> option : CDCONTMETHTP.entrySet()) {
        json.addProperty(option.getKey(), option.getValue());
    }
    model.put("options_" + i, json);
}

---

如果需要，我可以对其进行修改。

您的JSON映射是键-值对，无法保留键的顺序。您可以将JSON映射转换为数组，这将保持顺序

代替此JSON：

{
  "6": "Business Email",
  "1000005": "Deliver To Email",
  "7": "Personal Email"
}

[
  {"id": 6, "text": "Business Email"},
  {"id": 1000005, "text": "Deliver To Email"},
  {"id": 7, "text": "Personal Email"}
]

发送此JSON:

{
  "6": "Business Email",
  "1000005": "Deliver To Email",
  "7": "Personal Email"
}

[
  {"id": 6, "text": "Business Email"},
  {"id": 1000005, "text": "Deliver To Email"},
  {"id": 7, "text": "Personal Email"}
]

---

JSON映射是键-值对，无法保留键的顺序。您可以将JSON映射转换为数组，这将保持顺序

代替此JSON：

{
  "6": "Business Email",
  "1000005": "Deliver To Email",
  "7": "Personal Email"
}

[
  {"id": 6, "text": "Business Email"},
  {"id": 1000005, "text": "Deliver To Email"},
  {"id": 7, "text": "Personal Email"}
]

发送此JSON:

{
  "6": "Business Email",
  "1000005": "Deliver To Email",
  "7": "Personal Email"
}

[
  {"id": 6, "text": "Business Email"},
  {"id": 1000005, "text": "Deliver To Email"},
  {"id": 7, "text": "Personal Email"}
]

)；把uu放在数字前面

o/祝您愉快

；把uu放在数字前面

---

o祝您愉快

David的答案奏效了，但必须修改遍历元素的for循环。我已在此处发布了完整的解决方案：

var options_1 = {"1000006":"Alternate Business Phone","1000008":"Alternate Home Phone","1000001":"Business Phone","1000003":"Clinic Phone","3":"Facsimile","1000007":"Home Phone","1000004":"Lab Phone","4":"Pager","1000002":"Secure Msg Phone"};
var options_2 = {"6":"Business Email","1000005":"Deliver To Email","7":"Personal Email"};
function changePhoneEmailItems()
{
    var selectedItem = document.getElementById("addNewCategory").value;
    var options;
    if('1' === selectedItem) {
        options = options_1;
    } else {
        options = options_2;
    }

    var list = document.getElementById("addNewUsageType");
    list.options.length=0;
    Object.keys(options).forEach(function(i) {
        list.add(new Option(options[i].value, options[i].key))          
    });
}

---

David的答案是有效的，但必须修改遍历元素的for循环。我已在此处发布了完整的解决方案：

var options_1 = {"1000006":"Alternate Business Phone","1000008":"Alternate Home Phone","1000001":"Business Phone","1000003":"Clinic Phone","3":"Facsimile","1000007":"Home Phone","1000004":"Lab Phone","4":"Pager","1000002":"Secure Msg Phone"};
var options_2 = {"6":"Business Email","1000005":"Deliver To Email","7":"Personal Email"};
function changePhoneEmailItems()
{
    var selectedItem = document.getElementById("addNewCategory").value;
    var options;
    if('1' === selectedItem) {
        options = options_1;
    } else {
        options = options_2;
    }

    var list = document.getElementById("addNewUsageType");
    list.options.length=0;
    Object.keys(options).forEach(function(i) {
        list.add(new Option(options[i].value, options[i].key))          
    });
}

---

选项_1的形式不正确，无法作为Map构造函数的参数提供。它需要是一个数组的数组。内部数组的长度必须为2，其中内部数组的第一个元素是键，第二个元素应该是值。你看，这是因为你正在迭代一个对象而不是一个数组@zero298您能否重新格式化JSON以向我显示适当的格式并将其作为答案？同样，我可以控制JSON离开控制器的方式，但我不确定如何修改itoptions_1，因为它没有以正确的形式提供给Map的构造函数作为参数。它需要是一个数组的数组。内部数组的长度必须为2，其中内部数组的第一个元素是键，第二个元素应该是值。你看，这是因为你正在迭代一个对象而不是一个数组@zero298您能否重新格式化JSON以向我显示适当的格式并将其作为答案？同样，我可以控制JSON离开控制器的方式，但我不确定如何修改它。问题是这些是传递回控制器的数据库键，所以我以后必须删除这些。问题是这些是传递回控制器的数据库键，所以我以后必须，删除那些ux。你的答案有效，但我不得不修改for循环。我将此解决方案发布为下面的答案。JSON按插入时间顺序序列化和反序列化键，因此如果您使用处理此问题的库，则会对顺序产生很大影响。也就是说，使用列表来指定顺序可能更好，稳定的字符串化更适合于使用对象作为复杂的哈希键，但我必须修改for循环。我将此解决方案发布为下面的答案。JSON按插入时间顺序序列化和反序列化键，因此如果您使用处理此问题的库，则会对顺序产生很大影响。也就是说，使用列表来指定顺序可能更好，稳定的字符串化更适合于将对象用作复杂的哈希键