javascript - 当我添加另一个文件输入字段时,选定的文件被删除

原文 标签 javascript jquery html forms

我有一个表单,可以在其中根据用户需要添加新的文件输入字段。我用 div 包围输入,如下所示:

<div id="fileinputs">
    <div class="myinput">
        <label for="PropertyPic01">Photos</label>
        <input type="file" name="data[Property][pic01]" id="PropertyPic01">
    </div>
</div>

我的 jQuery 代码执行以下操作:
//Add Pic link
$('#addPic').click(function(e)
{
    if(!window.fotoCtr)
    {
        window.fotoCtr = 2;
    } else
    {
        window.fotoCtr++;
    }

    if(window.fotoCtr == 5)
    {
        $('#addPic').html('');
    }

    e.preventDefault();
    $('div#fileinputs').html($('div#fileinputs').html() + 
        '<div class="input file">' +
        '<input type="file" name="data[Property][pic0' + window.fotoCtr + ']" id="PropertyPic0' + window.fotoCtr + '">' +
        '</div><br/>'
        );
})

我遇到的问题是像上面那样添加另一个文件输入字段会导致从其他输入中选择的文件被删除。有没有什么办法解决这一问题?

最佳答案

使用而不是 html() append()方法,这会将数据绑定(bind)到以前的元素作为文件:

$('div#fileinputs').append(
        '<div class="input file">' +
        '<input type="file" name="data[Property][pic0' + window.fotoCtr + ']" id="PropertyPic0' + window.fotoCtr + '">' +
        '</div><br/>');

关于javascript - 当我添加另一个文件输入字段时,选定的文件被删除,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24065670/

相关文章:

html - 匹配整个文档中特定类型的第一个/第n个元素

javascript - 即使是简单的热图,我也无法让 heatmap.js 工作

php - 从数据库中检索时间时,javascript计时器未递减计数

javascript - 如何跳过对象循环中的键

javascript - 将文件图像附加到 Javascript 中的 FormData(Http 请求)

jquery - 使用jQuery自动提交表单

html - 调整浏览器大小时,媒体查询在桌面上工作,但在移动设备上不工作

jQuery 脚本在 Firefox 和 Internet Explorer 上返回新窗口

javascript - 从Node.js中的JSON导入数据库内部数据

html - 重置具有一定不透明度的元素的子元素的不透明度