在按钮上单击显示图像并在iframe加载时隐藏

时间:2014-03-05 11:01:25

标签: javascript php

我想在点击上传按钮后显示img.png。这是该按钮的代码:

<button style="padding: 4px;margin-top: 30px;border-radius: 0px;" type="submit" class="btn btn-primary btn-lg"><span class="glyphicon glyphicon-upload"></span></button>
<div id="image_details"></div>

我希望在文件名的值进入IFRAME时隐藏它。文件上传代码如下。

<form target="upload_target" id="fileupload" method="post" action="<?php echo site_url('upload_file/upload_it'); ?>" enctype="multipart/form-data">

<div class="fileUpload btn btn-warning">
   <span>Browse</span>
        <input id="uploadBtn" type="file" multiple="multiple" name="files[]" class="upload" />
</div>
<input id="uploadFile" style="width: 160px; margin-top: 30px;float: left;height: 34px;" placeholder="Choose File" disabled="disabled" />
<button style="padding: 4px;margin-top: 30px;border-radius: 0px;" type="submit" class="btn btn-primary btn-lg"><span class="glyphicon glyphicon-upload"></span></button>
<div id="image_details"></div>
</form>
</div>
    </div>
<div class="col-lg-3" style="padding-left:0px;">
<iframe id="upload_target" name="upload_target" src="#" style="border:0px; background-color:#FFFFFF; " scrolling="no">  
            </iframe>                   
</div>

1 个答案:

答案 0 :(得分:0)

使用jQuery,你应该添加两个事件:

$("#fileupload").on("submit", function()
  {
     //Put here the code to SHOW image
  });

$("#upload_target").on("load", function()
  {
     //Put here the code to HIDE image
  });