Javascript 单击某些按钮后选择2中的动态选项

我在我的网站中使用，我需要在一些用户交互后重新加载并使用新选项更改选择中的选项

我有这个：

当我选择一天时，我需要重新加载几个小时。因为每天都有不同的可用时间，如下所示：

这是我的javascript对象，包含我所需的所有信息，无需AJAX：

var ob = [
  {
    // Don't worry about activityId
    activityId: '1234',
    days: [
      {
        //Some date format
        id: '20161001',
        //Available hours for each day
        hours: ["10:00", "11:00"]
      },
      {
        id: '20161002',
        hours: ["10:00", "12:00"]
      }
    ]
  },
  {
    activityId: '4567',
    days: [
      {
        id: '20161003',
        hours: ["10:30", "19:00"]
      },
      {
        id: '20161002',
        hours: ["10:00", "14:00"]
      }
    ]
  }
]

我一直在尝试使用$'selectId'.select2{data:data}，但它只会将数据添加到当前可用的数据中，并且只工作一次。第二次不再添加

我想删除选项并设置新选项。我正在使用select2文档中的此变量：

var data = [
  { id: 0, text: 'enhancement' }, 
  { id: 1, text: 'bug' }, 
  { id: 2, text: 'duplicate' }, 
  { id: 3, text: 'invalid' }, 
  { id: 4, text: 'wontfix' }
];

总结：我想在天选择更改时更改小时选择的数据

有什么帮助吗？ 谢谢

我在几年前发现了，有一个答案建议在添加新的数据选项之前调用元素上的.html

试试这个：

var ob={ //不要担心activityId activityId:'1234'， 天数：[ { //一些日期格式 id:'20161001'， //每天的可用时间 时间：[10:00，11:00] }, { id:'20161002'， 时间：[10:00，12:00] } ] }; var days=ob.days.mapfunctionday{ 返回{id:day.id，text:day.id}； }; $e1.选择2{data:days}； $e1.0更改功能参数{ var值=$e1.val； var day=ob.days.findfunctionday{ return day.id==值； }; var selectList2=$e2； selectList2.html；//这将清除现有值 selectList2.select2{data:day.hours}； 选择List2.show；//以防以前不可见 }; .选择2{ 宽度：100%； 最小宽度：100px； }

---

谢谢，这就是我今天发现的。我将删除所有select，然后使用$item呈现新数据；