从弹出窗口中选择图像并显示在主页面中

Select image from popup and display in main page

本文关键字：显示主页选择窗口图像更新时间：2023-09-26

我正在使用bootstreap3弹出窗口（模型）从计算机中选择图像。我希望当用户选择一个或多个图像时，弹出窗口应该关闭，图像上传预览应该显示在主页面（<i class="fa fa-image image-popup-open" data-toggle="modal" data-target=".photo-modal-lg"></i>下方）。

我的代码是

 <div class="form-group">
        <div class="controls form-inline">
            <i class="fa fa-image image-popup-open" data-toggle="modal" data-target=".photo-modal-lg"></i>
            <div id="myModal" class="modal fade">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4>Upload Images</h4>
                        </div>
                        <div class="modal-body">
                            <div class="modal-title">
                                </div>
                            <div id='content' class="tab-content">
                                <div class="tab-pane active" id="uplod">
                                    <h1>Drag and Drop files using Dropzone.js</h1>
                                    <form action="upload.php"
                                          class="dropzone"
                                          id="my-awesome-dropzone"></form>
                                </div>
                            </div>    
 </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            <button type="button" class="btn btn-primary">Save changes</button>
                        </div>
                    </div>
                </div>
            </div>
            </div>
    </div>

我的代码在这里。如何进行

document.getElementById("imageid").src="../template/save.png";