Как объединить два поля в третье для тегов?

Question

Итак, у меня есть два поля: обычный ввод и раскрывающийся список. Я хочу, чтобы эти два поля были объединены в третье поле (которое предназначено для создания тегов). В третьем поле теги можно удалить, нажав X, но в противном случае ничего нельзя ввести. где или как называется этот процесс, поэтому я не могу найти плагин.

Это все, что я могу сделать. Я чувствую, что это jQuery плагин, который может это сделать, но я не уверен.

<form>
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Last name:</label>
 <select id="lname">
  <option value="Bryant">Bryant</option>
  <option value="oneal">O'Neal</option>
  <option value="Jordan">Jordan</option>
  <option value="Pippen">Pippen</option>
</select><br><br>

<input type="submit" value="Combine">
<br><br>
   <label for="fullname">Full name tags:</label>
  <input type="text" id="fullname" name="fullname" disabled><br><br>

</form>

Answer 1

Попробуйте это

function myFunction(){
  var fname = $('#fname').val();
  var lname = $('#lname').val();
  $('#fullname').val(fname + " " + lname);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<form>
  <label for="fname">First name:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">Last name:</label>
 <select id="lname" >
  <option value="Bryant">Bryant</option>
  <option value="oneal">O'Neal</option>
  <option value="Jordan">Jordan</option>
  <option value="Pippen">Pippen</option>
</select><br><br>

<input type="button" value="Combine" onclick="myFunction()">
<br><br>
   <label for="fullname">Full name tags:</label>
  <input type="text" id="fullname" name="fullname" disabled><br><br>

</form>