Показать сообщение отдельно
  #3 (permalink)  
Старый 02.11.2014, 00:16
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

<style>
  label {
    margin: 5px;
    padding: 4px 8px;
    border: 2px dotted green;
    cursor: pointer;
  }
  .music {
    margin-bottom: 20px;
  }
</style>
<form name="form">
  <div class="music">
    <select name="genre" multiple>
      <option value="blues" selected>Мягкий блюз</option>
      <option value="rock" selected>Жёсткий рок</option>
      <option value="classic" selected>Классика</option>
    </select>
  </div>
</form>
<br>
<form name="form2">
  <div class="music">
    <select name="music" multiple>
      <option value="executor" selected>Исполнитель</option>
      <option value="nationality" selected>Национальность</option>
      <option value="place" selected>Место проведения</option>
    </select>
  </div>
</form>
<script>
  function insValue(frm, nodeList) {
    var lbl = document.createElement('label');
    var fragment = document.createDocumentFragment();
    var tmp;
    for (var i = 0; i < nodeList.length; ++i) {
      if (nodeList[i].selected) {
        tmp = lbl.cloneNode();
        tmp.innerHTML = nodeList[i].value;
        fragment.appendChild(tmp);
      }
    }
    frm.appendChild(fragment);
  }
  var form1 = document.form;
  var form2 = document.form2;
  var options1 = form1.genre.options;
  var options2 = form2.music.options;
  insValue(form1, options1);
  insValue(form2, options2);
</script>

Так получше будет
Еще пример http://learn.javascript.ru/play/PbjEy

Последний раз редактировалось Vlasenko Fedor, 02.11.2014 в 04:22.
Ответить с цитированием