Question

我正在尝试将select及其选项转换为div和子div。我想要的是每个选择成为带有转换ID的div（正在工作）的div，并且在这些div内我希望它是各自的选项，我不知道该怎么做，如果有人知道我将不胜感激

$('.selects select').each(function(){
  var select = $(this);
  $('#transform').append('<div>');

  select.find('option').each(function(){
    var option = $(this).text();
    $('#transform div').append('<div>'+option+'</div>');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='selects'>
  <select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
  </select>   
  <select>
    <option>A</option>
    <option>B</option>
    <option>C</option>
    <option>D</option>
  </select>
</div>

<div id='transform'></div>

Answer 1

解决此问题的最简单方法是存储对要向其添加子div的div的引用。然后最后，将父div附加到您想要的任何位置。这样，您不必查找/记住孩子应该去哪里。

$('.selects select').each(function(){
  var select = $(this);
  var $div = $('<div>');

  select.find('option').each(function(){
    var option = $(this).text();
    $div.append('<div>'+option+'</div>');
  });

  $('#transform').append($div);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='selects'>
  <select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
  </select>   
  <select>
    <option>A</option>
    <option>B</option>
    <option>C</option>
    <option>D</option>
  </select>
</div>

<div id='transform'></div>

将select及其选项转换为div

1 个答案: