【问题标题】：Select File. Submit. Cannot select file again选择文件。提交。无法再次选择文件
【发布时间】：2015-08-24 13:20:21
【问题描述】：

我有一个包含不同字段和输入类型=“文件”的表单。我使用 fileupload jQuery 库。

选择文件

打电话

$('#some_id').fileupload().fileupload(
                    'send',
                    {
                        files: file,
                        url: widget.options.saveVideoUrl,
                    }
                ).success(
//...

（第一个文件上传需要初始化）

再次尝试选择文件。得到：没有选择文件，清除控制台等。

更新.1

问题出现在管理区域的电子商务框架Magento2。所描述的表格出现在像“滑出面板”这样的实体中。这意味着有 div 块，并且这个块使用 javascript 包裹在 aside 块中。

<button onclick="jQuery('#new').modal('openModal')" .... >
    <span>New</span>
</button>

这是演示示例：

管理网址：https://iwdagency.com/magento2/admin

用户名：管理员

密码：admin123

打开产品/目录/选择任何产品/点击新类别

您应该会看到以下面板：

在这样的面板上，我通过 php 构造函数字段添加：

<div class="admin__field field field-new_video_screenshot " data-ui-id="product-tabs-tab-google-experiment-fieldset-element-form-field-new-video-screenshot">
    <label class="label admin__field-label" for="..." data-ui-id="product-tabs-tab-google-experiment-fieldset-element-file-image-label"><span>Preview Image</span></label>
    <div class="admin__field-control control">
        <input id="...." name="image" data-ui-id="product-tabs-tab-google-experiment-fieldset-element-file-image" value="" title="Preview Image" type="file">
    </div>
</div>

脚本：

define([
    'jquery',
    'jquery/ui',
    'Magento_Ui/js/modal/modal',
    'mage/translate',
    'mage/backend/tree-suggest',
    'mage/backend/validation'
], function ($) {
    'use strict';

    $.widget('mage.newDialog', {
        _create: function () {
            var widget = this;
            var newVideoForm = $('#new');

            this.element.modal({
                type: 'slide',
                modalClass: 'mage-new-dialog form-inline',
                title: $.mage.__('Create'),
                buttons: [{
                    text: $.mage.__('Create'),
                    class: 'action-primary',
                    click: function (e) {
                        var file = $('#new_screenshot').get(0).files[0];
                        var result = $('#new_screenshot').fileupload().fileupload(
                            'send',
                            {
                                files: file,
                                url: widget.options.saveUrl,
                            }
                        ).success(
                            function(result, textStatus, jqXHR)
                            {
                                var data = JSON.parse(result);
                                data['url'] = $('#new_url').val();
                                data['name'] = $('#new_name').val();
                                data['description'] = $('#new_description').val();
                                $('#media_gallery_content').trigger('addItem', data);
                                $('#new').modal('closeModal')
                            }
                        );
                    }
                }],
            });
        }
    });

    return $.mage.newDialog;
});

【问题讨论】：

它是 BlueImp 文件上传插件吗？
请添加代码sn-p，我们可以帮助您。
已更新。抱歉提供了很多信息

标签： javascript jquery html forms file

【解决方案1】：

我发现了问题。

在我的情况下，问题出现在初始化 fileUpload 库之后。

当我选择输入：文件时，库没有初始化（读作感染）。当我按下按钮时，初始化运行，任何使用此输入的操作都变得不可用。

解决方案如下：在我们的输入被感染之前克隆我们的输入，而不是我们的操作，最后用之前创建的健康副本替换现有的受感染输入。

【讨论】：