将隐藏字段附加到DIV容器中,

时间:2016-02-10 14:00:46

标签: javascript jquery html jquery-ui dropzone.js

我有一个jQuery图像上传工具,它将上传的文件显示到div容器中。我想将带有字段值的隐藏字段附加到div容器的每个渲染图像

这是javascript代码

<script>
    $(function(){
        $('#fileupload').fileupload({
            url: 'upload',
            dataType: 'json',
            add: function (e, data) {
                data.submit();
            },
            success:function(response,status) {
                console.log(response.filename);
                var filePath = 'static/uploads/' + response.filename;
                var img = $('<img />', {
                    src: filePath
                });
                img.appendTo($('#Thumb'));
                $('#filePath').val(filePath);
                console.log('success');
            },
            error:function(error){
                console.log(error);
            }
        });
    })
</script>

这是当前的div布局,

<div class="form-group">
  <label for="txtPost">Photos</label>

<div class="input-group">
                <span class="input-group-btn">
                    <span class="btn btn-primary btn-file">
                        Browse&hellip; <input type="file" id="fileupload" name="file" multiple>
                    </span>
                </span>
        <div class="container" id="Thumb">
<input type="hidden" name="filePath" id="filePath"></input>
        </div>
            </div>

</div>

目前

var img = $('<img />', {
                        src: filePath
                    });
                    img.appendTo($('#Thumb'));

能够将图像源添加到div布局中,我也希望对隐藏的输入类型执行相同的操作以附加到相同的元素ID。

1 个答案:

答案 0 :(得分:1)

不会这样做吗

var img = $('<img />', {
    src: filePath
});
img.appendTo($('#Thumb'));

var inp = $('<input type="hidden" />', {
    value: 'some value of yours'
});
inp.appendTo($('#Thumb'));