jQuery each 在变量内部循环

Question

我对这段代码有疑问，

var sourceArray = ['facebook', 'instagram', 'youtube', 'twitter', 'linkedin', 'vk', 'google+'];

var utmMediumContent = '<select name="utm-source" id="i-utm-source" class="builder-input">'+
$.each(sourceArray, function(index,value){
    console.log ('<option value="'+value+'">'+value+'</option>');
    return ('<option value="'+value+'">'+value+'</option>');
})
+'</select>';

console.log(utmMediumContent);

第一个console.log准确返回，我想要什么<option value="facebook">facebook</option>等，

但第二个 console.log 只返回数组中的选择和值 - facebook、instagram、youtube 等。

<select name="utm-source" id="i-utm-source" class="builder-input">facebook,instagram,youtube,twitter,linkedin,vk,google+</select>

如果可能的话，我将不胜感激如何在变量内部循环的任何帮助或解决方案。

提前感谢您的帮助

Answer 1

这不是你应该做的。您应该将 select 和 options 附加到数组中。查看工作的 sn-p：

var sourceArray = ['facebook', 'instagram', 'youtube', 'twitter', 'linkedin', 'vk', 'google+'];

var utmMediumContent = [];
utmMediumContent += '<select name="utm-source" id="i-utm-source" class="builder-input">';
  $.each(sourceArray, function(index, value) {
    //console.log('<option value="' + value + '">' + value + '</option>');
    utmMediumContent += '<option value="' + value + '">' + value + '</option>';
  });
utmMediumContent += '</select>';
console.log(utmMediumContent);
$(utmMediumContent).appendTo('body');

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

Answer 2

您可以使用连接构造元素，而不是返回：

  utmMediumContent  += '<option value="'+value+'">'+value+'</option>';
});
utmMediumContent += '</select>';