选择选项上的输入类型文件答案

【问题标题】：Input type file on select option选择选项上的输入类型文件
【发布时间】：2016-11-30 07:46:27
【问题描述】：

有没有办法例如使用引导程序来放置一个

input type="file"

对于select 字段中的每个option？

这样我就可以为每个选项选择一个文件了吗？

<fieldset class="form-group">
    <select class="form-control" id="language_selection" name="language_selection[]" multiple>
        @foreach($languages as $languageKey => $languageValue)
            <option value="<?php echo $languageValue->short_name; ?>"><?php echo $languageValue->name; ?></option>
        @endforeach
    </select>
</fieldset>

我想为用户选择的每个选项添加一个输入文件，我该如何完成？

编辑

这些是选项值：

'de'
'pt'
'en'
'es'
'ru'
'nl'
'fr'
'bo'
'da'
'et'
'fi'
'sv'
'ge'
'el'
'is'
'it'
'hr'
'lv'
'lt'
'mk'
'ro'
'me'
'nw'
'pl'
'se'
'sk'
'sl'
'cs'
'tr'
'uk'
'hu'
'bg'
'ga'
'mt'

【问题讨论】：

@foreach 不是 Bootstrap，而是它的 Blade - 您可能希望相应地进行编辑并调整您的标签。
我认为@foreach 现在并不重要，只是想表明我正在 foreach 上运行
好的，您正在使用 php 生成 select 的选项，对，现在，您想使用 JavaScript 为 select 上的每个选定值创建一个输入文件，对吧？
@Hackerman 是这样的
你能把为 select 生成的 html 和所有选项放在一起吗？...而且，我可以使用 Jquery 还是需要在纯 JS 中完成？

标签： javascript html twitter-bootstrap input blade

【解决方案1】：

根据您的问题，我能够使用 Jquery 实现以下目标：

HTML

<fieldset class="form-group">
<select class="form-control" id="language_selection" name="language_selection[]" multiple>
    <option value="de">Deutschland</option>
    <option value="pt">Portugal</option>
    <option value="en">England</option>
    <option value="es">Espana</option>
</select>
</fieldset>
<div id="divFileInput"></div>

jQuery

$('#language_selection').change(function(){
    var selections = $("#language_selection :selected");
    var html = '';
    $.each(selections,function(i,item){
        html += $(item).text()+':<input type="file" id="'+$(item).val()+'" /><br>';
    })
    $('#divFileInput').html(html);
})

工作小提琴：https://jsfiddle.net/robertrozas/f4ze70yq/

【讨论】：