javascript - 如何使用数组元素作为按钮标签动态创建单选按钮

Question

我想根据我从数据库调用的数组元素创建单选按钮。并且这个元素应该用作每个单选按钮的标签。我如何为它编码。我将 6 元素称为用户名建议。当客人选择任何按钮时，特定按钮的标签将替换客人输入的名称类型。谢谢你

Answer 1

function showSuggestions() {
  var usernames = [
    'test1', 'test2', 'test3', 'test4'
  ];
  
  var result = $('#result');
  result.html('');

  for (var i = 0; i < usernames.length; i++) {
    result.append('<label><input type="radio" name="usernames" value="' + usernames[i] + '" /> ' + usernames[i] + '</label>');
  } 
}
                      
$('button').click(showSuggestions);

$('#result').on('change', 'input', function() {
  var elem = $(this);
  if (elem.is(':checked')) {
    $('#search').val(elem.val());
  }
});

label {
  display:block;  
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id="search" type="search" /><button>Search</button>

<div id="result"></div>