多个select2选项和复选框的本地存储,无需覆盖

时间:2018-02-19 11:16:04

标签: jquery local-storage jquery-select2

当谈到本地存储时,我的大脑总是变得糊里糊涂。我想分配多个复选框的选择,并选择2个下拉选项到本地存储。我已经成功地为复选框拼凑了一些代码,没有覆盖。我现在需要添加下拉选项。但到目前为止,我所有的努力都会覆盖复选框选择,反之亦然。理想情况下,我正在寻找对现有存储代码的一些调整,包括下拉列表,但不知道这是否可行。任何帮助非常感谢。小提琴:https://jsfiddle.net/tw3fx8q9/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>


<div id="Country_trREPT_Store">
  <label><input type="checkbox"  id="UN20r"/>Andorra</label>
  <label><input type="checkbox"  id="UN40r"/>Austria</label>
  <label><input type="checkbox"  id="UN56r" />Belgium</label>
</div>


<div id="myDropdowns">
  <select id="drop_plate" multiple="multiple" style='margin-top: 20px'>
  <option value="one">one</option>
  <option value="two">two</option>
  <option value="three">three</option>
</select>

  <select id="drop_sheet" multiple="multiple" style='margin-top: 20px'>
   <option value="four">four</option>
   <option value="five">five</option>
   <option value="six">six</option>
</select>
</div>

。     $(function(){

  var $containers = $('#Country_trREPT_Store');
  var $Sel2Dropdowns = $('#myDropdowns');


// Save INDIVIDUALLY SELECTED checkbox status to local-storage
  $containers.on("change", "input", function() {
    var $checkboxes = $(':checkbox:checked');
    var selected = $(':checkbox:checked').map(function() {
      return this.id;
    }).get();
    selected = '#' + selected.join(',#');
   localStorage.setItem('TradeTab_LocalStorage', selected);
    console.log(localStorage.getItem('TradeTab_LocalStorage'));
  });

})

0 个答案:

没有答案