Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 01.11.2014, 22:31
Интересующийся
Отправить личное сообщение для usa-1500 Посмотреть профиль Найти все сообщения от usa-1500
 
Регистрация: 07.02.2014
Сообщений: 19

Label в Javascript
Решил попробовать создать вторую форму с метками и вывести. Никак не выводит form2. Что нужно исправить в коде чтобы вывело?

<!DOCTYPE HTML>

  <meta charset="utf-8">
  <title>SELECT</title>
 </head>
 <body>
<form name="form">
  <select name="genre" multiple>
    <option value="blues" selected>Мягкий блюз</option>
    <option value="rock" selected>Жёсткий рок</option>
    <option value="classic" selected>Классика</option>
  </select>
</form>
<br>
<form name="form2">
  <select name="music" multiple>
    <option value="executor" selected>Исполнитель</option>
    <option value="nationality" selected>Национальность</option>
    <option value="place" selected>Место проведения</option>
  </select>
</form>

<script>

var form = document.body.children[0];
var select = form.elements.genre;

for (var i=0; i<=select.options.length; i++) {
  var option = select.options[i];

  if(option.selected) {
    document.writeln(option.value);
  }

}


var form2 = document.body.children[0];
var select = form2.elements.music;

for (var j=0; j<=select.options.length; j++) {
  var option2 = select.options[j];

  if(option2.selected) {
  	document.writeln(option2.value);
  }
}
</script>

 </body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 01.11.2014, 22:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,126

usa-1500,
не использовать document.writeln или document.write пока не освоите азы.
Ответить с цитированием
  #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.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Книга: JavaScript. Сильные стороны Magneto Учебные материалы 16 21.04.2013 15:28
Интерпретатор Java на JS kobezzza Оффтопик 24 11.10.2012 18:32
Первый Moscow JavaScript Meetup korenyushkin Общие вопросы Javascript 0 26.07.2011 15:23
Последние книги по JavaScript! monolithed Учебные материалы 7 26.10.2010 19:40
Выдвет ошибку JavaScript Ромио Opera, Safari и др. 4 21.10.2010 20:34