图像预览仅适用于第一张图像

时间:2017-02-02 04:08:12

标签: javascript php jquery

我的js代码预览在输入字段中选择的图像。一般工作正常。

在这种情况下,我在页面中有15个图像,在点击时以模态打开。 用户可以单击任何图像并上传新图像,它将出现。

仅使用第一张图片。不适用于其他图像。

是因为模态还是应该更改JS代码?



<script type="text/javascript" >
              $(document).ready(function(){
        function readURL(input) {
                if (input.files && input.files[0]) {
                    var reader = new FileReader();
                    
                    reader.onload = function (e) {
                      
               $('#blah').attr('src', e.target.result);
                     }
                    
                    reader.readAsDataURL(input.files[0]);
        			
                }
            }
                
                 $("#imgInp").change(function(){
                readURL(this);
            });
                
         });
        </script>

   
<div id="myModal_<?php echo $post_slug;?>" class="modal fade" role="dialog">
          <div class="modal-dialog">

            <!-- Modal content-->
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Edit Post</h4>
              </div>
              <div class="modal-body">
                
        		<div id="edit_post">
        		
        		
        		</div>
        		<div >
        		<span class="input-btn">
                <button class="browse btn btn-danger input-md" type="button">< change</button>
              </span>
        		
        	
          </div>
           
        		<img id="blah"  src="images/<?php echo $post_image3;?>"   />
        		
        		 <input type="file" name="image" class="file" id="imgInp"/>
        		
        		
        	  
        	  
        	  
        		
        </form>
        		
        		</div>
        		
              </div>
              <div class="modal-footer">
                <button  style="float: left;" type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        		<span  >  <button type="submit" class="btn btn-info" name="saveedit" > Save </button></span>
              </div>
            </div>

          </div>
        </div>
  </div>
&#13;
&#13;
&#13;

0 个答案:

没有答案