Присвоить значения Дропдаун листа

@Shivanizy · Регистрация: 24.07.2017

Author24 — интернет-сервис помощи студентам

Дорогие друзья возникла такая вот проблема, у меня имеется инпут, после него идёт Дропдаун лист с тегами, после чего Кнопка , При введении текста в инпут и выборе в дропдаун листе нужного нам тега, и нажатии на финальную кнопку, создаётся элемент и записывается текст импута в выбранном нам теге. Но мне так же нужно добавить дропдаун лист со значениями Color, Border и Margin. Принцип работы тот же , только добавляется выбранное значение и нового листа и выводится в тот же новосозданный элемент. Но я не могу задать Value, прошу помощи с данной задачей. А вот и мой код

PHP/HTML

<!DOCTYPE html>
<html>
<head>
<style>
 
.zap {
    background-color: #4CAF50;
    height: 54px;
    color: white;
}
 
#barev:hover {
  background-color: white;
  background-image: none;
}
#barev {
  height: 70px;
color:black;
border-color: black;
border-width: 0.1px;
/*background-image: url(http://glisa.ru/secret.php);*/
}
 
 
 
</style>
</head>
<body>
<input id="barev" type="text" name="lname" value=""><br><br>
<select id="bar">
  <option disabled>YO</option>
  <option id="pick" value="p">p</option>
  <option value="h1" >h1</option>
  <option value="div">div</option>
</select>
<select id="bar1">
  <option value="">СТАЙЛЫ!</option>
  <option value="">ЦВЕТОЧКИ</option>
  <option value="Border">РАМОЧКИ</option>
  <option value="Margin">РАЗМЕР ИМЕЕТ ЗНАЧЕНИЕ</option>
</select>
 
<button class="zap" onclick="myFunction()">Запоминалка</button></br></br>
 
<script>
 
 
function myFunction() {
 
    var x = document.getElementById("bar");
    var btn = document.createElement(x.value);
    var x2 = document.getElementById("bar1");
    var btn2 = document.createElement(x2.value);
    var x1 = document.getElementById("barev");
    var t = document.createTextNode(x1.value);
    btn.appendChild(t);
    document.body.appendChild(btn);
}
 
 
</script>
 
</body>
</html>

	24.07.2017, 13:17