Как при клике переносить значение в другой div?

Question

[drtvader]

Добрый день! Каким образом при клике на чекбокс переносить его значение в другой div?
Например кликаю на первый с текстом Ringe, то этот текст переносился в

<span class="b-filter-level-first__name b-filter-level-first__name--second open">Kategorie</span>

https://jsfiddle.net/7xzsmmj8/

<li class="b-filter-level-first__item dropdown-submenu js-no-close"><span class="b-filter-level-first__name b-filter-level-first__name--second open">Kategorie</span>
  <ul class="dropdown-menu b-dropdown__menu--second-menu js-no-close" style="display: block;">
    <li>
      <div class="b-checkbox">
        <input type="checkbox" name="model-name" id="model-name1">
        <label for="model-name1" class="b-checkbox__name b-checkbox__name--filter">Ringe</label>
      </div>
    </li>
    <li>
      <div class="b-checkbox">
        <input type="checkbox" name="model-name" id="model-name2">
        <label for="model-name2" class="b-checkbox__name b-checkbox__name--filter">Ohrringe</label>
      </div>
    </li>
    <li>
      <div class="b-checkbox">
        <input type="checkbox" name="model-name" id="model-name3">
        <label for="model-name3" class="b-checkbox__name b-checkbox__name--filter">Anhänger</label>
      </div>
    </li>
    <li>
      <div class="b-checkbox">
        <input type="checkbox" name="model-name" id="model-name4">
        <label for="model-name4" class="b-checkbox__name b-checkbox__name--filter">Ketten</label>
      </div>
    </li>
  </ul>
</li>

Answer 1

[Сергей Соколов]

Аналогичный вопрос и ответ:

var tags = [
    "Value 0",
    "Value 1",
    "Value 2",
    "Value 3",  
  ]
  ,selected = []
  ,$in = $('#workDesignTags')
;

render();
$("#workDesignLabels input").on("change", clickHandle);

function render() {
  var i, v, items=[];
  for(i=0;i<tags.length; i++) {
    v = tags[i];
    items.push( $('<label>').append( $('<input>', {
        type:"checkbox",
        name:"design",
        value: i,
      })).append( v)
    );
  };
  $('#workDesignLabels').append(items);
}

function clickHandle() {
  var i, k = $(this).val(), result = [];
  if( !!~(i = selected.indexOf(k))) {
    selected.splice( i, 1);
  } else {
    selected.push(k);
  }
  for(i=0;i<selected.length;i++) result.push( tags[ selected[i]]);
  $in.val( result.join(', '));
};

HTML:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="formRow labelBox col3 dropDownMobile" id="workDesign">
  <input type="text" name="tags" id="workDesignTags">
  <div id="workDesignLabels"></div>
</div>

Comments

[drtvader]

нет, не работает. Фильтров может быть много, не писать же. Мне ms понять, с чего начать вообще. Думал сделать просто перенос через val, но тоже не работает.

[Сергей Соколов]

drtvader: не писать же код самому? =) В ответе именно ваша задача. Что вам не понятно в этом вариантм?

[Сергей Соколов]

https://jsfiddle.net/sergiks/7xzsmmj8/1/

[drtvader]

Сергей Соколов: спасибо! Теперь буду дальше под себя редактировать. Пока не очень хорошо читаю чужой код.